HTML DOM compareDocumentPosition() kaedah Bandingkan lokasi dokumen-html tutorial-php.cn

HTML DOM compareDocumentPosition() kaedah Bandingkan lokasi dokumen

PHPz

Lepaskan： 2023-09-14 19:21:10

ke hadapan

1250 orang telah melayarinya

Kaedah

HTML DOM CompareDocumentPosition() digunakan untuk membandingkan kedudukan nod yang diberikan dengan mana-mana nod lain dalam mana-mana dokumen. Jenis pulangan kaedah ini ialah jenis integer yang menerangkan kedudukannya dalam dokumen. Nilai pulangan integer adalah seperti yang dinyatakan -

1: No relationship, the two nodes do not belong to the same document.
2: The first node (para1) is positioned after the second node (para2).
4: The first node (para1) is positioned before the second node (para2).
8: The first node (para1) is positioned inside the second node (para2).
16: The second node (para2) is positioned inside the first node (para1).
32: No relationship, or the two nodes are two attributes on the same element.

Salin selepas log masuk

Syntax

Berikut ialah sintaks kaedah HTML DOM CompareDocumentPosition() -

node.compareDocumentPosition(node)

Salin selepas log masuk

Nod di sini ialah jenis objek nod, menyatakan nod yang ingin kita bandingkan dengan nod semasa.

Contoh

Mari kita lihat contoh kaedah compareDocumentPosition() -

<!DOCTYPE html>
<html>
<body>
<p id="para1">This is a paragraph</p>
<p id="para2">This is another paragraph</p>
<p>Click the button to compare the position of the two paragraphs.</p>
<button onclick="docPosition()">POSITION</button>
<p id="Sample"></p>
<script>
   function docPosition() {
      var p1 = document.getElementById("para1").lastChild;
      var p2 = document.getElementById("para2").lastChild;
      var x = p2.compareDocumentPosition(p1);
      document.getElementById("Sample").innerHTML = x;
   }
</script>
</body>
</html>

Salin selepas log masuk

Output

Ini akan menghasilkan output berikut -

HTML DOM compareDocumentPosition() 方法

比较文档位置

Apabila klik butang -

di atas contoh Sederhana - HTML DOM compareDocumentPosition() 方法

比较文档位置

Kami mula-mula mencipta dua elemen dengan id "para1" dan "

perenggan 2".

<p id="para1">This is a paragraph</p>
<p id="para2">This is another paragraph</p>

Salin selepas log masuk

Kemudian kami mencipta butang POSTION yang akan melaksanakan kaedah docPosition() apabila pengguna mengklik - Kaedah

<button onclick="docPosition()">POSITION</button>

Salin selepas log masuk

docPosition() mendapat elemen

menggunakan kaedah getElementById() pada objek dokumen. Kemudian, ia memberikan nilai atribut lastchild kedua-dua perenggan kepada pembolehubah p1 dan p2 masing-masing.

Kemudian, kami memanggil kaedah compareDocumentPosition() pada p2 dengan p1 sebagai parameter. Ini bermakna kita ingin membandingkan kedudukan p2 berbanding p1. Oleh kerana di sini p2 adalah selepas p1, nilai pulangan ialah 2 -

function docPosition() {
   var p1 = document.getElementById("para1").lastChild;
   var p2 = document.getElementById("para2").lastChild;
   var x = p2.compareDocumentPosition(p1);
   document.getElementById("Sample").innerHTML = x;
}

Salin selepas log masuk

Atas ialah kandungan terperinci HTML DOM compareDocumentPosition() kaedah Bandingkan lokasi dokumen. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!