XML DOM
XML의 기본은 DOM(문서 개체 모델)입니다. DOM 문서는 계층적으로 구성된 노드 또는 정보 블록의 집합입니다. 개발자는 이러한 계층 구조를 통해 탐색 트리에서 특정 정보를 찾을 수 있습니다.
DOM(Document Object Model)은 문서에 액세스하고 조작하기 위한 표준 방법을 정의합니다.
XML DOM
XML DOM(XML 문서 개체 모델)은 XML 문서에 액세스하고 조작하기 위한 표준 방법을 정의합니다.
XML DOM은 XML 문서를 트리 구조로 봅니다.
모든 요소는 DOM 트리를 통해 액세스할 수 있습니다. 해당 내용은 수정되거나 삭제될 수 있으며 새 요소가 생성될 수 있습니다. 요소, 텍스트 및 속성은 모두 노드로 간주됩니다.
XML DOM 튜토리얼에서 XML DOM에 대해 자세히 알아볼 수 있습니다.
HTML DOM
HTML DOM은 HTML 문서에 액세스하고 조작하기 위한 표준 방법을 정의합니다.
모든 HTML 요소는 HTML DOM을 통해 액세스할 수 있습니다.
HTML DOM 튜토리얼에서 HTML DOM에 대해 자세히 알아볼 수 있습니다. .
XML 파일 로드 - 브라우저 간 예
다음 예에서는 XML 문서("note.xml")를 XML DOM 개체로 구문 분석한 다음 JavaScript를 통해 일부 정보를 추출합니다.
예
<html><body><h1>W3Cschools 내부 메모</h1><div><b>받는 사람:</b> <span id="to"></span><br /><b>받는 사람:< /b> <span id="from"></span><br /><b>메시지:</b> <span id="message"></span></div><script>if (창 .XMLHttpRequest){// 코드 IE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest();}else{// IE6용 코드, IE5xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.open("GET","note.xml",false);xmlhttp.send();xmlDoc=xmlhttp.responseXM L;document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;document.g etElementById("from").innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;document.getElemen tById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;</script></body></html>시도해 보세요 »중요 사항!
위 XML 파일("note.xml")의 <to> 요소에서 "Tove" 텍스트를 추출하려면 구문은 다음과 같습니다.
getElementsByTagName("to")[0].childNodes[0].nodeValueXML 파일에 <to> 요소가 하나만 포함된 경우에도 배열 인덱스 [0]을 지정해야 합니다. 이는 getElementsByTagName() 메서드가 배열을 반환하기 때문입니다.
XML 문자열 로드 - 브라우저 간 예
다음 예에서는 XML 문자열을 XML DOM 개체로 구문 분석한 다음 JavaScript를 통해 일부 정보를 추출합니다.
예
<html><body><h1>W3Cschools 내부 메모</h1><div><b>받는 사람:</b> <span id="to"></span><br /><b>받는 사람:< /b> <span id="from"></span><br /><b>메시지:</b> <span id="message"></span></div><script>txt="<note>";txt=txt+"<to>토베</to>";txt=txt+"<from>자니</from >";txt=txt+"<heading>알림</heading>";txt=txt+"<body>이것을 잊지 마세요 주말!</body>";txt=txt+"</note>";if (window.DOMParser){parser=new DOMParser();xmlDoc=parser.parseFromString(txt,"text/xml");}else / /Internet Explorer{xmlDoc=새로 만들기 ActiveXObject("Microsoft.XMLDOM");xmlDoc.async=false;xmlDoc.loadXML(txt);}document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0] .nodeValue;document.getElementById("from" ).innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;document.getElementById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0] .nodeValue;</script></body></html>시도해 보세요 »
다음 섹션에서는 HTML 페이지에 XML 데이터를 표시하는 방법을 배우게 됩니다.