-
[XSLT 예제] HTML 테이블 그리기Coding/etc 2019. 9. 17. 15:51
XSLT 테이블 그리기
오늘은 XSLT 템플릿으로 테이블을 그리는 것을 해보겠습니다. 사실 output method로 HTML을 지정하기 때문에 HTML로 테이블을 그리기만 하면 되네요.
하지만 XSLT로 작성했을 때의 장점은 for-each 구문을 통해 행/열의 최대 갯수를 모르더라도 동적으로 추가할 수 있다는 점이죠. 지난번에 사용한 라이언의 창고재고목록표를 그려보도록 하죠.
이 표를 그려보도록 하겠습니다. 데이터 샘플은 지난 예제와 같은 것을 사용하면 되겠네요.
그 다음 HTML로 간단한 Table을 만들어 봅시다.
XSLT 기본 파일 작성법은 이전 포스팅을 참고해주세요.2019/09/06 - [Coding/XML] - [XSLT 예제] 간단한 조건문 처리하기
<?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <head></head> <body> <table border="1"> <tr> <td>상품</td> <td>종류</td> <td>수량</td> </tr> </table> </body> </html> </xsl:template> </xsl:stylesheet>
border = 1의 간단한 테이블을 그려줍시다. 우선 상품, 종류, 수량 세 가지 항목이 들어가야겠네요.
for-each 구문을 이용하면 for문처럼 반복된 작업을 할 수 있다고 했습니다.
밑에 이 코드를 추가해 줍시다.<?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html> <head></head> <body> <table border="1"> <tr> <td>상품</td> <td>종류</td> <td>수량</td> </tr> <!--추가된 부분--> <xsl:for-each select="products_list/product"> <tr> <td> <xsl:value-of select="name"/> </td> <td> <xsl:value-of select="category"/> </td> <td> <xsl:value-of select="amount"/> </td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:stylesheet>
for-each 구문은 해당 노드가 있는 한 작업을 반복해 줄 것이고, 저렇게 테이블을 그리면 알아서 행/열이 추가됩니다. 각각 항목에 맞는 태그명을 입력하여 value-of 옵션을 통해 출력해줍니다.
그러면 결과는
이렇게 테이블이 그려지는 것을 볼 수 있습니다.
for-each 구문이 참 편하군요
'Coding > etc' 카테고리의 다른 글
[Javascript] 웹 브라우저에서 XML 파싱하기 (0) 2019.09.18 [XMLHttpRequest] XMLHttpRequest란 무엇일까 (0) 2019.09.18 [XSLT 예제] 다중 조건문 수행하기 (1) 2019.09.09 [XSLT 예제] 간단한 조건문 처리하기 (0) 2019.09.06 XML 기본 문법 (0) 2019.09.04