HTML에는 수많은 서식 지정문이 포함될 뿐만 아니라 콘텐츠 데이터가 가득 차 있어 매우 혼란스럽습니다. 아티스트는 인터페이스 레이아웃을 조정할 때 콘텐츠 데이터를 실수로 수정할 수 있습니다. 전문 콘텐츠 유지관리자는 데이터를 유지관리할 때 의도치 않게 전문 레이아웃 코드를 망칠 수 있습니다.
그 결과 사람들은 의식적으로 이러한 혼란스러운 상황을 회피하기 시작했습니다. 데이터 설명은 XML을 사용하고 페이지 레이아웃 코드만 HTML로 유지하여 인터페이스에서 데이터를 분리하고 수정으로 인해 콘텐츠 데이터가 더 이상 손실되지 않도록 하세요. 데이터를 유지하면서 페이지 레이아웃을 변경하지도 않습니다.
데이터와 인터페이스가 분리되어 있는데, 이들을 유기적으로 결합할 수 있는 방법이 필요한 것 같습니다. 다양한 HTML과 결합된 XML 데이터는 고객에게 다양한 데이터 검색 방법을 제공할 수 있습니다. XML Data Island는 번거로운 코드를 작성하지 않고도 XML의 데이터를 HTML에 자연스럽게 도입할 수 있습니다.
아래 예시를 통해 설명해드리겠습니다.
책 정보를 저장하기 위해 다음 내용을 포함하는 "Book.xml"이라는 XML 파일이 있다고 가정합니다.
<?xmlversion="1.0"encoding="gb2312"?> <books> <bookid="0001"bookcategory="文艺"amount="150"remain="80"discount="8.7"> <title>三国演义</title> <author>罗贯中</author> <publisher>文艺出版社</publisher> <isbn>0-765-58007-8</isbn> <price>80</price> </book> <bookid="0002"bookcategory="文艺"amount="100"remain="70"discount="9.8"> <title>红楼梦</title> <author>曹雪芹</author> <publisher>三秦出版社</publisher> <isbn>0-765-58007-9</isbn> <price>22</price> </book> <bookid="0003"bookcategory="文艺"amount="120"remain="60"discount="8.5"> <title>西游记(上下册)</title> <author>吴承恩</author> <publisher>人民文学出版社</publisher> <isbn>0-765-58007-3</isbn> <price>40.12</price> </book> </books>
각 책 노드(Book)에는 분류, 데이터, 여백, 할인의 4가지 속성과 책 제목, 저자, 출판사, ISBN이 있습니다. 가격은 5개의 하위 요소입니다. 이는 단지 XML 데이터 아일랜드의 사용법을 알려드리기 위한 것이므로 데이터 구조가 매우 간단하고 데이터의 양이 그리 많지 않습니다.
HTML의 테이블 형식으로 XML의 내용을 표시하려고 합니다. 이제 HTML 파일 작성을 시작합니다. 먼저 책 정보를 표시하기 위해 HTML로 테이블을 구성합니다. 이 부분은 모두에게 매우 혼란스러울 것이므로 자세한 내용은 다루지 않겠습니다. XML 데이터 가져오기를 정의하는 방법과 데이터 테이블 HTML 테이블 을 바인딩하는 방법에 중점을 두겠습니다.
XML Data Island는 이름에서 알 수 있듯이 데이터 소스 역할을 합니다. 즉, 데이터를 저장하는 XML 파일을 도입하고 ID를 할당하여 HTML에서 을 보다 쉽게 참조할 수 있도록 해줍니다. 정의 코드는 다음과 같습니다.
<xmlid="XMLData"src="Test07.xml"></xml>
<tableid="tblbooks"datasrc="#XMLData"border=1datapagesize=2width="100%"> <thead> <thstyle="font-style:blod">书名</th> <thstyle="font-style:blod">类别</th> <thstyle="font-style:blod">书号</th> <thstyle="font-style:blod">作者</th> <thstyle="font-style:blod">出版社</th> <thstyle="font-style:blod">定价</th> <thstyle="font-style:blod">数量</th> <thstyle="font-style:blod">余量</th> </thead> <tr> <td><spandatafld="title"></span></td> <td><spandatafld="bookcategory"></span></td> <td><spandatafld="isbn"></span></td> <td><spandatafld="author"></span></td> <td><spandatafld="publisher"></span></td> <td><spandatafld="price"></span></td> <td><spandatafld="amount"></span></td> <td><spandatafld="remain"></span></td> </tr> </table>
태그에 배치하고 | < /span> | 는 이 태그가 제목 필드에 바인딩되고 필드 값이 자동으로 태그에 채워짐을 의미합니다.