5장: XML 인스턴스 구문 분석
개요:
1: 효과 예시
2: 분석 예 1. 새 로고를 정의합니다.
2. XML 문서를 생성합니다.
3. 해당 HTML 파일을 생성합니다.
XML은 기술 분야의 MathML, 무선 통신 애플리케이션의 WML, 네트워크 이미지의 SVG 등 다양한 분야에서 널리 사용됩니다. 여기서는 웹에서의 XML 애플리케이션에 중점을 둡니다. 웹에서 XML을 적용할 때 주로 XML의 강력한 데이터 조작 기능을 활용합니다. 일반적으로 JavaScript 및 ASP와 같은 서버측 프로그램과 함께 XML을 사용하면 네트워크에서 거의 모든 애플리케이션 요구 사항을 실현할 수 있습니다.
설명의 편의를 고려하여 서버측 프로그램을 포함하지 않은 간단한 예를 아래에 소개합니다. 목적은 XML의 데이터 조작 기능에 대한 지각적인 이해를 제공하는 것입니다.
좋습니다. 먼저 [여기를 클릭]하여 예제의 효과를 살펴보겠습니다. (IE5.0 이상 버전의 브라우저를 사용하여 열어주세요)
이것은 간단한 CD 기록 데이터 검색 기능입니다. "이전" 및 "다음"을 클릭하면 단일 CD에 대한 관련 정보를 볼 수 있습니다. 우리는 원래 이 효과를 얻기 위해 두 가지 방법을 사용했습니다.
1. DHTML을 사용하여 여러 레이어의 데이터를 숨기고 마우스 이벤트를 통해 순차적으로 표시합니다.
2. ASP, CGI, PHP, JSP 등의 백그라운드 프로그램을 사용하여 서버측 데이터를 호출합니다.
하지만 이 예에서는 페이지의 원본 코드를 열면 DHTML DIV나 양식 작업이 완전히 XML로 구현되어 있음을 알 수 있습니다. 아래에서 생산 과정을 분석해 보겠습니다.
1단계: 새 ID를 정의합니다.
실제 CD 데이터에 따라 먼저 <CD>라는 새 ID를 생성하고, 두 번째로 CD 이름 <제목>, 가수 <아티스트>, 출판 연도 <연도>, 국가 <국가>와 같은 관련 데이터 ID를 설정합니다. 발행회사 <Company>와 가격 <Price>, 마지막으로 카탈로그 <CATALOG>라는 로고가 생성되어야 합니다. 또 다른 <CATALOG> 태그를 만드는 이유는 무엇입니까? 루트 요소(ID)는 하나만 있어야 하고 하나만 있을 수 있다고 XML 문서에 규정되어 있기 때문에 여러 개의 CD 데이터가 있고 이러한 데이터는 병렬 관계에 있으므로 이러한 병렬 요소에 대한 루트 요소를 만들어야 합니다.
위 요소의 정의와 관계는 XML 표준을 완전히 따르며 특별한 DTD 파일을 정의할 필요가 없으므로 DTD 정의를 생략할 수 있습니다. DTD를 사용하여 정의하려면 위 프로세스를 다음과 같이 표현할 수 있습니다.
<!요소 카탈로그(CD)*>
<!ELEMENT CD (제목,아티스트,연도,국가,회사,가격)>
<!요소 제목(#PCDATA)>
<!ELEMENT 아티스트(#PCDATA)>
<!ELEMENT 연도(#PCDATA)>
<!ELEMENT 국가(#PCDATA)>
<!ELEMENT 회사(#PCDATA)>
<!ELEMENT 가격(#PCDATA)>
이 코드는 CATALOG 요소에 여러 CD 하위 요소가 포함되어 있고 하위 요소 CD에 제목, 아티스트, 연도, 국가, 회사, 가격 등 6개의 하위 요소가 포함되어 있으며 해당 내용이 텍스트(문자, 숫자, 텍스트) . (참고: 특정 구문 지침은 이전 장의 DTD 소개를 참조하세요.)
2단계: XML 문서를 생성합니다.
<?xml 버전="1.0"?>
<카탈로그>
<CD>
<TITLE>제국 벌레스크</TITLE>
<ARTIST>밥 딜런</ARTIST>
<국가>미국</국가>
<COMPANY>컬럼비아</COMPANY>
<가격>10.90</가격>
<연도>1985</연도>
</CD>
<CD>
<TITLE>마음을 숨겨보세요</TITLE>
<ARTIST>보니 타일러</ARTIST>
<국가>영국</국가>
<COMPANY>CBS 레코드</COMPANY>
<가격>9.90</가격>
<연도>1988</연도>
</CD>
<CD>
<TITLE>최고의 히트곡</TITLE>
<ARTIST>돌리 파튼</ARTIST>
<국가>미국</국가>
<회사>RCA</회사>
<가격>9.90</가격>
<연도>1982</연도>
</CD>
<CD>
<TITLE>여전히 우울함</TITLE>
<ARTIST>게리 모어</ARTIST>
<국가>영국</국가>
<COMPANY>버진 리워드</COMPANY>
<PRICE>10.20</PRICE>
<연도>1990</년>
</CD>
<CD>
<TITLE>에로스</TITLE>
<ARTIST>에로스 라마초티</ARTIST>
<국가>EU</국가>
<COMPANY>BMG</COMPANY>
<가격>9.90</가격>
<연도>1997</연도>
</CD>
</카탈로그>
위 코드는 먼저 <?xml version="1.0"?> 선언문을 사용하여 이것이 XML 문서이고 해당 형식이 XML 1.0 표준 사양을 준수함을 나타냅니다. 그런 다음 문서 내용이 있고 구조 트리가 매우 명확합니다.
<카탈로그>
<CD>
...
</CD>
<CD>
...
</CD>
</카탈로그>
총 5개의 데이터 세트가 정의됩니다. 호출을 위해 위 코드를 cd.xml 파일로 저장합니다.
3단계: 해당 HTML 파일을 만듭니다.
1. XML 데이터를 가져옵니다.
우리는 현재 널리 사용되는 브라우저 중에서 Microsoft의 IE5.0 이상의 브라우저만이 현재 XML을 지원한다는 것을 알고 있습니다. IE는 HTML의 object 객체를 통한 XML 삽입을 지원하며, js의 XMLDocument.load() 메서드를 통해 데이터를 가져옵니다. 코드를 살펴보겠습니다: <object WIDTH="0" HEIGHT="0"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" ID="xmldso">
</object>
ID 이름이 xmldso인 개체를 정의합니다. 그런 다음 js를 사용하여 헤드 영역에 xml 데이터를 추가합니다.
<script for="창" 이벤트="onload">
xmldso.XMLDocument.load("cd.xml");
</script>
2. 데이터를 묶습니다.
그런 다음 <SPAN> 태그를 사용하여 테이블의 XML 데이터를 바인딩합니다. 그 중 ID, DATASRC, DTATFLD는 모두 <SPAN>의 속성이다. 코드는 다음과 같습니다:
<테이블>
<tr><td>제목:</td><td><SPAN ID="title" DATASRC=#xmldso DATAFLD="TITLE"></SPAN></td></tr>
<tr><td>아티스트:</td><td><SPAN ID="artist" DATASRC=#xmldso DATAFLD="ARTIST"></SPAN></td></tr>
<tr><td>연도:</td><td><SPAN ID="연도" DATASRC=#xmldso DATAFLD="연도"></SPAN></td></tr>
<tr><td>국가:</td><td><SPAN ID="country" DATASRC=#xmldso DATAFLD="COUNTRY"></SPAN></td></tr>
<tr><td>회사:</td><td><SPAN ID="회사" DATASRC=#xmldso DATAFLD="COMPANY"></SPAN></td></tr>
<tr><td>가격:</td><td><SPAN ID="price" DATASRC=#xmldso DATAFLD="PRICE"></SPAN></td></tr>
</table>
3. 액션 동작.
마지막으로 데이터에 대한 찾아보기 버튼을 제공합니다.
<INPUT TYPE=버튼 VALUE="이전 CD" ONCLICK="moveprevious()">
<INPUT TYPE=버튼 VALUE="다음 CD" ONCLICK="movenext()">
그리고 js를 사용하여 movenext() 및 moveprevious()라는 두 가지 마우스 클릭 기능을 완성합니다. 헤드 영역에 다음 코드를 추가합니다.
<스크립트 언어="자바스크립트">
함수 movenext()
{
if (xmldso.recordset.absoluteposition < xmldso.recordset.recordcount)
{
xmldso.recordset.movenext();
}
}
함수 moveprevious()
{
if (xmldso.recordset.absoluteposition > 1)
{
xmldso.recordset.moveprevious();
}
}
</script>
좋습니다. 먼저 HTML 파일의 전체 원본 코드를 살펴보겠습니다.
<html>
<머리>
<script for="창" 이벤트="onload">
xmldso.XMLDocument.load("cd.xml");
</script>
<스크립트 언어="자바스크립트">
함수 movenext()
{
if (xmldso.recordset.absoluteposition < xmldso.recordset.recordcount)
{
xmldso.recordset.movenext();
}
}
함수 moveprevious()
{
if (xmldso.recordset.absoluteposition > 1)
{
xmldso.recordset.moveprevious();
}
}
</script>
<TITLE>CD 탐색</TITLE>
</head>
<본문>
<p>
<객체 WIDTH="0" HEIGHT="0"
CLASSID="clsid:550dda30-0541-11d2-9ca9-0060b0ec3d39" ID="xmldso">
</object>
<테이블>
<tr><td>제목:</td><td><SPAN ID="title" DATASRC=#xmldso DATAFLD="TITLE"></SPAN></td></tr>
<tr><td>아티스트:</td><td><SPAN ID="artist" DATASRC=#xmldso DATAFLD="ARTIST"></SPAN></td></tr>
<tr><td>연도:</td><td><SPAN ID="연도" DATASRC=#xmldso DATAFLD="연도"></SPAN></td></tr>
<tr><td>국가:</td><td><SPAN ID="country" DATASRC=#xmldso DATAFLD="COUNTRY"></SPAN></td></tr>
<tr><td>회사:</td><td><SPAN ID="회사" DATASRC=#xmldso DATAFLD="COMPANY"></SPAN></td></tr>
<tr><td>가격:</td><td><SPAN ID="price" DATASRC=#xmldso DATAFLD="PRICE"></SPAN></td></tr>
</table>
<p>
<INPUT TYPE=버튼 VALUE="이전 CD" ONCLICK="moveprevious()">
<INPUT TYPE=버튼 VALUE="다음 CD" ONCLICK="movenext()">
</p>
</body>
</html>
위 코드를 cd.htm 파일로 저장하고 두 번째 단계에서 cd.xml 파일과 함께 넣습니다. cd.htm 파일을 열면 위의 예와 동일한 효과를 볼 수 있습니다.
자, 지금까지 우리는 XML에 대해 많은 것을 배웠습니다. XML 빠른 소개, XML 개념 원칙, XML 용어, XML 구문 및 이 장의 예제 분석 등 이전 5개 장을 요약해 보겠습니다. 여기서 튜토리얼 부분이 종료됩니다. 집필 과정에서 Ajie는 관련 XML 개념을 이해하기 쉽게 설명하고 모든 사람에게 자신이 이해한 내용을 알리기 위해 최선을 다했습니다. 그러나 오랫동안 XML을 공부하지 않았기 때문에 제가 이해한 내용은 다음과 같습니다. XML 기술 전체가 체계적이지 않고 심도가 깊어서 누락된 부분이 있을 수 있으니 양해 부탁드립니다.