>웹 프론트엔드 >JS 튜토리얼 >JavaScript 기사로 서버 측 XML을 읽고 표시합니다.

JavaScript 기사로 서버 측 XML을 읽고 표시합니다.

Christopher Nolan
Christopher Nolan원래의
2025-03-10 00:53:09744검색
XML은 웹 서비스에서 중요한 역할을하며 여러 클라이언트 및 서버 언어와 함께 강력한 역할을 수행 할 수 있습니다. 이 기사는 XML 및 클라이언트 JavaScript를 사용하여 XML 파일 컨텐츠를 표시하고 자식 요소에 액세스하고 작동 요소 등을 표시하는 방법을 살펴 봅니다.

브라우저 호환성 문제 클라이언트 언어에서 브라우저 호환성이 주요 문제입니다. XML과 JavaScript의 조합의 경우 문제는 주로 XML입니다. 모든 브라우저가 XML 문서를 구문 분석하는 것은 아닙니다.

다음 코드 예제는 IE6을 기반으로합니다. XML을 지원하지 않는 브라우저는 이러한 코드를 읽을 수 없으므로이 브라우저에서 XML 파일을 볼 때 브라우저는 모든 태그를 무시합니다.
xml 파일 예 다음은 회사 직원 데이터 및 회전율을 보여주는 샘플 XML 파일입니다.
javaScript

를 사용하여 XML 파일 데이터 조작 xml 파일을로드

다음 JavaScript 코드를 통해 XML 파일을로드 할 수 있습니다.

실제로 함수의 마지막 두 줄은 XML 파일을로드하기에 충분합니다. 처음 두 줄은 XML 파일 데이터를 조작하는 데 사용하는 모든 JavaScript 기능이 초기화되지 않은 개체에서 작업을 수행하지 않도록합니다. 따라서 verife () 함수를 호출하십시오

XML 파일을로드 할 수 있습니다
xml 파일 내용을 표시

XML 파일의 전체 컨텐츠를 보려면
<?xml version="1.0" ?>
<company>
  <employee age="19" sex="M">Premshree Pillai</employee>
  <employee age="24" sex="M">Kumar Singh</employee>
  <employee age="21" sex="M">Ranjit Kapoor</employee>
  <turnover>
    <year>100,000</year>
    <year>140,000</year>
    <year>200,000</year>
  </turnover>
</company>
를 사용하십시오. 전체 XML 파일은 적절한 압입이있는 경고 상자에있는대로 표시됩니다.
하위 요소 및 노드

위의 XML 파일에서 가 최상위 태그이며 다른 모든 태그가 그 아래에 있습니다. 이 태그를 자식 요소라고합니다. 이 XML 파일은 폴더 트리 형식으로 그래픽으로 표시 될 수 있습니다.

위의 XML 파일에서 최상위 태그

에는 4 개의 자식 요소가 있습니다.

아동 요소의 수 (일반적으로 모든 언어로)는 0 (0)에서 시작합니다.
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");

function loadXML(xmlFile) {
  xmlDoc.async = "false";
  xmlDoc.onreadystatechange = verify;
  xmlDoc.load(xmlFile);
  xmlObj = xmlDoc.documentElement;
}
태그 아래에는 3 개의 자식 요소가 있습니다.

우리는
function verify() {
  // 0 对象未初始化
  // 1 对象正在加载数据
  // 2 对象已加载数据
  // 3 可以处理对象中的数据
  // 4 对象完全初始化
  if (xmlDoc.readyState != 4) {
    return false;
  }
}
속성을 ​​사용하여 태그가 가지고있는 자식 요소의 수를 찾을 수 있습니다. 따라서 태그 (여기)의 자식 요소의 수는 를 통해 찾을 수 있습니다.

loadXML('xml_file.xml');
태그 (여기)의 자식 요소의 수는 를 통해 찾을 수 있습니다.

우리는 가 의 세 번째 자식 요소이기 때문에 여기서

를 사용합니다.

alert(xmlObj.xml); 테스트 아동 요소

를 사용하여 특정 노드 하위 요소에 자식 요소가 있는지 테스트 할 수 있습니다. 따라서

는 TRUE를 반환합니다. 태그에는 자식 요소가 없기 때문에 가 false를 반환합니다.

태그 이름을 얻으십시오 를 사용하여 자식 요소의 레이블 이름을 얻을 수 있습니다. 따라서 는 "회사"를 반환합니다. 는 "직원"을 반환합니다. 는 "연도"가 돌아옵니다.

태그의 내용을 표시 childNodes(i).tagName xmlObj.tagName XML 파일에서 xmlObj.childNodes(0).tagName 태그의 내용은 "Premshree Pillai"입니다. xmlObj.childNodes(3).childNodes(0).tagName를 사용 하여이 값을 얻을 수 있습니다.

속성 XML 파일에서 태그에는 3 개의 속성이 있습니다. 속성은 를 사용하여 액세스 할 수 있습니다. 따라서 는 "001"을 반환합니다. 는 "24"를 반환합니다. 는 "F"를 반환합니다.

... (FAQ 부품을 포함한 후속 내용은 같은 방식으로 다시 작성하고 원래 의미를 유지하며 문구 및 문장 구조를 조정할 수 있습니다.)

.

위 내용은 JavaScript 기사로 서버 측 XML을 읽고 표시합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.