DOM 액세스
XML DOM - 액세스 노드
DOM은 XML 문서의 모든 노드에 대한 액세스를 제공합니다.
시도해 보세요 - 예
다음 예에서는 books.xml XML 파일을 사용합니다. .
외부 JavaScript에 있는 loadXMLDoc() 함수는 XML 파일을 로드하는 데 사용됩니다.
노드 목록의 인덱스 번호를 사용하여 노드에 액세스하세요
이 예에서는 getElementsByTagname() 메서드를 사용하여 "books.xml"의 세 번째 <title> 요소를 가져옵니다.
길이 속성을 사용하여 노드 탐색
이 예에서는 길이 속성을 사용하여 "books.xml"의 모든 <title> 요소를 탐색합니다.
요소의 노드 유형 보기
이 예에서는 nodeType 속성을 사용하여 "books.xml"에서 루트 요소의 노드 유형을 가져옵니다.
요소 노드 트래버스
이 예에서는 nodeType 속성을 사용하여 "books.xml"의 요소 노드를 처리합니다.
노드 관계를 사용하여 요소 노드 순회
이 예에서는 nodeType 속성과 nextSibling 속성을 사용하여 "books.xml"의 요소 노드를 처리합니다.
노드 액세스
다음 세 가지 방법으로 노드에 액세스할 수 있습니다.
1. getElementsByTagName() 메서드를 사용합니다.
2. 노드 트리를 반복(순회)합니다.
3. 노드 관계를 활용하여 노드 트리를 탐색합니다.
getElementsByTagName() 메소드
getElementsByTagName()은 지정된 태그 이름을 가진 모든 요소를 반환합니다.
구문
인스턴스
다음 예는 x 요소 아래의 모든 <title> 요소를 반환합니다.
위의 내용에 유의하세요. 인스턴스는 x 노드 아래의 <title> 요소만 반환합니다. XML 문서의 모든 <title> 요소를 반환하려면 다음을 사용하세요.
여기서 xmlDoc은 문서 자체입니다( 문서 노드).
DOM 노드 목록(Node List)
getElementsByTagName() 메소드는 노드 목록을 반환합니다. 노드 목록은 노드의 배열입니다.
다음 코드는 loadXMLDoc()를 사용하여 "books.xml"을 xmlDoc에 로드한 다음 변수 x에 <title> 노드 목록을 저장합니다.
x=xmlDoc.getElementsByTagName("title");
x의 <title> 요소는 색인 번호를 통해 액세스할 수 있습니다. . 세 번째 <title>에 액세스하려면 다음과 같이 작성하세요.
참고: 인덱스는 0부터 시작합니다.
이 튜토리얼의 이후 장에서는 노드 목록에 대해 자세히 배우게 됩니다.
DOM 노드 목록 길이
length 속성은 노드 목록의 길이(즉, 노드 수)를 정의합니다.
길이 속성을 사용하여 노드 목록을 반복할 수 있습니다:
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title");
for (i=0;i<x.length;i++)
{
document.write(x[i].childNodes[0].nodeValue);
document.write("<br>");
}
</script>
</body>
</html>인스턴스 실행»
온라인 예제를 보려면 "예제 실행" 버튼을 클릭하세요
예제 설명:
loadXMLDoc()을 사용하여 " books.xml"을 xmlDoc으로
모든 <title> 요소 노드 가져오기
각 <title>의 텍스트 노드 값을 출력합니다. ; 요소
노드 유형
XML 문서의 documentElement 속성은 루트 노드입니다.
노드의 nodeName 속성은 노드의 이름입니다.
노드의 nodeType 속성은 노드의 유형입니다.
이 튜토리얼의 다음 장에서 노드 속성에 대해 자세히 알아봅니다.
해 보세요
노드 통과
다음 코드는 요소 노드이기도 한 루트 노드의 하위 노드를 통과합니다.
예
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.documentElement.childNodes;
for (i=0;i<x.length;i++)
{
if (x[i].nodeType==1)
{//Process only element nodes (type 1)
document.write(x[i].nodeName);
document.write("<br>");
}
}
</script>
</body>
</html>인스턴스 실행»
온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요
인스턴스 설명:
loadXMLDoc()을 사용하여 "books.xml"을 xmlDoc에 로드합니다.
루트 요소의 하위 노드 가져오기
각 하위 노드의 노드 유형을 확인하세요. 노드 유형이 "1"이면 요소노드
요소노드이면 노드 이름이 출력된다
탐색 노드 관계
다음 코드는 노드 관계를 사용하여 노드 트리를 탐색합니다.
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0].childNodes;
y=xmlDoc.getElementsByTagName("book")[0].firstChild;
for (i=0;i<x.length;i++)
{
if (y.nodeType==1)
{//Process only element nodes (type 1)
document.write(y.nodeName + "<br>");
}
y=y.nextSibling;
}
</script>
</body>
</html>인스턴스 실행»
온라인 예제를 보려면 "예제 실행" 버튼을 클릭하세요.
loadXMLDoc()을 사용하여 "books.xml"을 xmlDoc에 로드하세요.
첫 번째 책 요소의 하위 노드 가져오기
"y" 변수를 첫 번째 책 요소의 첫 번째 하위 노드로 설정
각 하위 노드(첫 번째 하위 노드는 "y"로 시작)에 대해 노드 유형을 확인하고, 노드 유형이 "1"이면 요소 노드입니다
요소 노드인 경우 노드 이름을 출력
"y" 변수를 다음 형제 노드로 설정하고 다시 루프를 실행합니다
