문서 내용의 탐색에 Node를 사용할 수 있으며, 이 때 다양한 부모, 자식, 형제 메소드를 사용한다.
main.html
<frameset cols="40%, *">
<frame name="docin" src="docin.html" />
<frame name="docout" src="docout.html" />
</frameset>
docin.html
<body>
<div id="div1">
<h1>header</h1>
<p>khklfhjhdjhfdtsjdyfklgljfjhgdfgcvjnhgcjgfjhg</p>
<p>Second paragraph with image following.</p>
</div>
</body>
docout.html
<script type="text/javascript" language="javascript">
//<![CDATA[
printTags(0, top.docin.document);
function printTags(domLevel, n) {
document.writeln("<br /><br />Level "+domLevel+":<br />");
document.writeln(n.nodeName+" ");
if(n.nodeType == 3) {
document.writeln(n.nodeValue);
}
if(n.hasChildNodes()) {
var child = n.firstChild;
document.writeln(" { ");
do {
document.writeln(child.nodeName+" ");
child = child.nextSibling;
} while(child);
document.writeln(" } ");
var children = n.childNodes;
for(var i=0; i<children.length; i++) {
printTags(domLevel+1, children[i]);
}
}
}
//]]>
</script>
위 예제는 아주 간단한 트리 탐색을 수행한다.
각 레벨에서 데이터를 배열에 저장한 후 출력하고 차례대로 트리를 탐색하면서
각 형제 엘리먼트로 이동하기 전에 부모-자식의 흔적을 출력한다.
참고 ;
문서 트리 탐색에 있어 더 좋은 방법은 레벨 2 탐색 및 범위 스펙을 사용하는 것이다.
http://www.w3.org/TR/2000/REC-DOM-Level-2-Traversal-Range-20001113/여기서 정보를 얻을 수 있으며 정교한 트리 검색을 할 수 있는 API를 제공한다.
이러한 기능 외에도 Node는 새로운 노드를 추가하고 수정하는데 사용할 수 있는 여러 가지 메소드를 제공한다.
이 메소드들은 새로운 엘리먼트를 생성하기 위해 사용되는 문서 객체 메소드와 함께 사용한다.