XML DOM คุณสมบัติ nextSibling

คำนิยามและการใช้งาน

nextSibling ตัวแปรนี้จะกลับตัวเพื่อนที่เดียวกันที่ต่อไปขององค์ประกอบที่เลือก (ตัวเพื่อนที่ต่อไปในระดับต้นไม้เดียวกัน)

ถ้าไม่มีตัวเลือกนั้น ตัวแปรจะกลับค่า null

ภาษาเขียน

elementNode.nextSibling

จำเป็นต้องระวังFirefox และเบราเซอร์ที่ส่วนใหญ่อื่นจะมองเห็นช่องว่างหรือบรรทัดว่าเป็นไนน์โอข้อความ แต่ Internet Explorer ไม่เช่นนั้น ดังนั้นในตัวอย่างด้านล่าง พวกเราใช้ฟังก์ชันเพื่อตรวจสอบประเภทของตัวเพื่อนต่อไป

โครงสร้างของตัวไนน์โอโดยเฉพาะ nodeType จะมีค่า 1 ดังนั้นถ้าตัวน้องน้องต่อไปไม่ใช่โครงสร้างไนน์โอ มันจะย้ายไปยังตัวเพื่อนต่อไปและตรวจสอบว่าตัวนี้เป็นโครงสร้างไนน์โอหรือไม่ การกระทำนี้จะดำเนินต่อไปจนกระทั่งหาถึงตัวเพื่อนที่เดียวกันที่ต่อไป (ต้องเป็นโครงสร้างไนน์โอ) ดังนั้นผลลัพธ์จะถูกต้องในทุกเบราเซอร์

คำแนะนำ:หากต้องการข้อมูลเพิ่มเติมเกี่ยวกับความแตกต่างระหว่างเว็บเบราเซอร์ โปรดเข้าถึงหน้าอธิบาย XML 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>Next sibling: " + y.nodeName + " = " +
    y.childNodes[0].nodeValue;
}

親自試一試

ตัวอย่าง 2

ใช้วิธี previousSibling สำหรับใช้กุญแจนำเข้าข้อมูลขององค์ประกอบที่มีอันดับก่อนหน้านี้

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>Previous sibling: " + y.nodeName + " = " + 
    y.childNodes[0].nodeValue;
}

親自試一試