XML DOM previousSibling 속성

Element 객체

정의와 사용법

previousSibling 이 속성은 선택된 요소의 이전同级 노드(동일한 트리 레벨의 이전 노드)를 반환합니다.

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

문법

elementNode.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

nextSibling를 사용하여 노드의 다음 동일 등급 노드를 가져옵니다:

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

직접 시험해 보세요

Element 객체