Thuộc tính previousSibling của XML DOM

Định nghĩa và cách sử dụng

previousSibling Thuộc tính này trả về phần tử cùng cấp trước đó của phần tử được chọn (phần tử trước đó trong cùng cấp trong cây).

Nếu không tồn tại phần tử như vậy, thuộc tính này sẽ trả về null.

Cú pháp

elementNode.previousSibling

Lưu ý:Firefox và hầu hết các trình duyệt khác sẽ coi khoảng trống hoặc dòng trống là phần tử văn bản, trong khi Internet Explorer không. Do đó, trong ví dụ sau, chúng ta sử dụng một hàm để kiểm tra loại phần tử của phần tử cùng cấp trước đó.

Điểm nodeType của phần tử là 1, vì vậy nếu phần tử cùng cấp trước đó không phải là phần tử, thì di chuyển đến phần tử trước đó và kiểm tra phần tử đó có phải là phần tử hay không. Điều này sẽ tiếp tục cho đến khi tìm thấy phần tử cùng cấp trước đó (phải là phần tử). Như vậy, kết quả sẽ đúng trên tất cả các trình duyệt.

Lưu ý:Để biết thêm thông tin về sự khác biệt giữa các trình duyệt, hãy truy cập phần DOM Browser của Giáo trình XML DOM.

Mô hình

Ví dụ 1

Mã dưới đây sẽ tải "books.xml" vào xmlDoc và lấy nút cùng cấp trước của phần tử đầu tiên <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();
// Kiểm tra nút con cùng cấp trước có phải là nút元素 hay không
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>Em bé cùng cấp trước: " + y.nodeName + " = " +
    y.childNodes[0].nodeValue;
}

Thử trực tiếp

Ví dụ 2

Sử dụng nextSibling để lấy nút con cùng cấp tiếp theo của một nút:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        myFunction(this);
    }
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
// Kiểm tra nút con cùng cấp tiếp theo có phải là nút元素 hay không
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>Em trai sau: " + y.nodeName + " = " + 
    y.childNodes[0].nodeValue;
}

Thử trực tiếp