XML DOM nextSibling 속성

Node 객체

정의 및 사용법

nextSibling 속성은 특정 노드 뒤에 있는 노드(동일한 트리 수준의 다음 노드)를 반환합니다.

그러한 노드가 존재하지 않으면 이 속성은 null을 반환합니다.

문법

nodeObject.nextSibling
팁 및 노트

주의:Firefox와 대부분의 다른 브라우저는 공백이나 줄 바꿈을 텍스트 노드로 간주하지만, Internet Explorer는 아닙니다. 따라서 아래 예제에서는 다음 형제 노드의 노드 타입을 확인하는 함수를 사용합니다.

요소 노드의 nodeType가 1이므로 다음 형제 노드가 요소 노드가 아니면 다음 노드로 이동하여 해당 노드가 요소 노드인지 확인합니다. 이는 다음 동일 수준 노드(요소 노드여야 합니다)를 찾을 때까지 지속됩니다. 이렇게 하면 모든 브라우저에서 결과가 올바르게 표시됩니다.

ヒント：브라우저 간 차이에 대해 더 많은 정보를 얻으려면 XML DOM 강의의 DOM 브라우저 단원을 방문하세요.

예제

예제 1

아래 코드는 "books.xml"을 xmlDoc에 로드하고, 첫 번째 <title> 요소에서 다음 동일 등급 노드를 가져옵니다:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
   if (this.readyState == 4 && this.status == 200) {
       myFunction(this);
   {}
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
// 다음 동일 등급 형제 노드가 요소 노드인지 확인
function get_nextsibling(n) {
    var x = n.nextSibling;
    while (x.nodeType != 1) {
        x = x.nextSibling;
    {}
    return x;
{}
function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName("title")[0];
    var y = get_nextsibling(x);
    document.getElementById("demo").innerHTML = x.nodeName + " = " +
    x.childNodes[0].nodeValue +
    "<br>다음 형제: " + y.nodeName + " = " +
    y.childNodes[0].nodeValue;
{}

직접 테스트해 보세요

예제 2

��取节点的前一个同级节点：

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        myFunction(this);
    {}
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
// 첫 번째 동일 등급 노드가 요소 노드인지 확인
function get_previoussibling(n) {
    var x = n.previousSibling;
    while (x.nodeType != 1) {
        x = x.previousSibling;
    {}
    return x;
{}
function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName("author")[0];
    var y = get_previoussibling(x);
    document.getElementById("demo").innerHTML = x.nodeName + " = " + 
    x.childNodes[0].nodeValue +
    "<br>이전 형제: " + y.nodeName + " = " + 
    y.childNodes[0].nodeValue;
{}

직접 테스트해 보세요

Node 객체