본문 바로가기

JavaScript/xml

DOM 기초 다지기 : DOM 요소 접근


노드 트리 탐험

XML 문서에서 XML 요소를 얻어오는 가장 흔한 방법은 노드 트리를 순회하여 각 요소의 텍스트 값을 얻어 오는 것이다. 어떻게 하는지에 대한 예를 들기 위해 VBScript의 for/each문을 사용하였다.

다음은 XML 노드 트리를 탐험하여 브라우저에 XML 요소를 표시하는 VBScript 코드이다:

set xmlDoc=CreateObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load("note.xml")

for each x in xmlDoc.documentElement.childNodes
  document.write(x.nodename)
  document.write(": ")
  document.write(x.text)
next


 

Providing HTML content from XML files

XML을 사용하는 가장 큰 이유 중의 하나가 HTML 문서에서 데이터 부분을 분리하기 위함이다. 브라우저에 내장된 XML 파서를 사용함으로써 XML 문서에 있는 데이터를 자바스크립트로 접근하여 HTML 파일 내에 표시할 수 있게 된다.

아래 예는 자바스크립트를 이용하여 XML 데이터를 읽어들인 후 HTML 요소에 대입하는 예이다:

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load("note.xml")

nodes = xmlDoc.documentElement.childNodes

to.innerText = nodes.item(0).text
from.innerText = nodes.item(1).text
header.innerText = nodes.item(2).text
body.innerText = nodes.item(3).text


 

이름으로 XML 요소 접근하는 방법

아래 예는 자바스크립트로 XML 데이터를 읽은 후 HTML 요소에 대입하는 예이다. 이 때 요소의 이름을 통해 XML 데이터에 접근하는 것을 볼 수 있을 것이다:

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load("note.xml")

document.write(xmlDoc.getElementsByTagName("from").item(0).text)