XML DOM previousSibling 속성

Node 객체

정의 및 사용법

previousSibling 속성은 바로 앞의 노드(동일한 트리 수준의 다음 노드)를 반환합니다.

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

문법

nodeObject.previousSibling
팁 및 노트

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

요소 노드의 nodeType 가 1이므로, 이전同级 노드가 요소 노드가 아니면 다음 노드로 이동하고, 이 노드가 요소 노드인지 확인합니다. 이 작업은 이전同级 노드(반드시 요소 노드여야 합니다)를 찾을 때까지 계속됩니다. 이렇게 하면 모든 브라우저에서 결과가 올바르게 됩니다.

힌트:브라우저 간의 차이에 대해 더 많은 정보를 알고 싶다면, XML DOM 튜토리얼의 DOM 브라우저 섹션을 방문하세요.

실례

예제 1

아래 코드는 "books.xml"를 xmlDoc에 로드하고, 첫 번째 <author> 요소에서 이전同级节点를 가져옵니다:

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;
{}

직접 테스트해 보세요

예제 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_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;
{}

직접 테스트해 보세요

Node 객체