Apakah kaedah yang ada untuk melintasi nod dalam jquery?

Kaedah yang boleh digunakan oleh jquery untuk melintasi nod ialah: 1. children(), yang boleh mengembalikan semua elemen anak langsung 2. next(), yang boleh mengembalikan elemen adik-beradik seterusnya bagi elemen yang dipilih; . nextAll() , boleh mengembalikan semua elemen adik beradik selepas elemen yang dipilih 4. prev() ;

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.2, komputer Dell G3.

Ringkasan kaedah traversal nod JQuery

1 elemen Semua nod elemen anak

<p>Hello</p>
<div>
  <span>Hello Again</span>
  <p class="box">您好!</p>
</div>
<p>And Again</p>
<script type="text/javascript">
  $(&#39;div&#39;).children();   //<span>Hello Again</span><p class="box">您好!</p>
  $(&#39;div&#39;).children(&#39;.box&#39;)  //<p class="box">您好!</p>
</script>

2. kaedah next(): $('p').next() --- Cari elemen adik beradik bersebelahan selepas elemen p Tetapi bukan semua elemen adik beradik

[Kaedah berkaitan]

(1) kaedah nextAll(): $('p').nextAll() ---- selepas mencari p Semua elemen adik beradik

　(2)nextUntil() kaedah: $('p').nextUntil('p')----Cari semua elemen adik beradik

selepas p hingga elemen p

<p>Hello</p>
<p class="box">Hello Again</p>
<div>
  <span>And Again</span>
</div>
<script type="text/javascript">
  $(&#39;p&#39;).next();   //<p>Hello Again</p><div><span>And Again</span></div>
  $(&#39;p&#39;).next(&#39;.box&#39;);  //<p class="box">Hello Again</p>
</script>

3. kaedah prev(): $('p').prev() ---- Cari elemen adik beradik bersebelahan sebelum p

　[Berkaitan Kaedahnya]

　(1)prevAll() method:$('p').prevAll() ---- Cari semua elemen adik-beradik sebelum p

　(2)prevUntil( ) kaedah: $('p ').prevUntil('p') --- Cari semua elemen sebelum p hingga elemen p

<p>Hello</p>
<div>
  <span>Hello Again</span>
</div>
<p>And Again</p>
<script type="text/javascript">
  $(&#39;p&#39;).prev();  //<div><span>Hello Again</span></div>
</script>

4. siblings() method: $('p') .siblings()--- - Cari semua elemen adik-beradik sebelum dan selepas p

5. kaedah ind(): $('p').find('span') ---- Cari anak dalam unsur unsur p dan ialah a elemen span

6. kaedah eq(): $('p').eq(1) --- Cari elemen p kedua (subskrip indeks bermula dari 0)

7 () kaedah: $('li').first() --- Dapatkan elemen li pertama

8 last() kaedah: $('li').last( ) --- Dapatkan elemen li terakhir

9. kaedah filter() : $('p').filter('.box') --- Dapatkan elemen p dengan kotak nama kelas

10 () kaedah: $('.box').is('p') ---- Tentukan sama ada .box ialah unsur p

kaedah map(): $( 'p').peta (panggil balik) --- Jalankan fungsi panggil balik untuk setiap p

Contoh: Lintas elemen input untuk mendapatkan nilainya dipisahkan dengan "," dan tambahkannya pada elemen p selepas

<p><b>Values: </b></p>
<form>
 <input type="text" name="name" value="John"/>
 <input type="text" name="password" value="password"/>
 <input type="text" name="url" value="http://ejohn.org/"/>
</form>
<script type="text/javascript">
  $("p").append( $("input").map(function(){
     return $(this).val();
    }).get().join(", ") );  //<p>John, password, http://ejohn.org/</p> 
</script>

12. kaedah hasClass(): $('p').hasClass('box') ---- Cari kaedah p

13: $ ('p').has('. span') ---- Cari elemen p yang mengandungi elemen span

14. kaedah not(): $('p').not('span' ) ---- Cari elemen p yang tidak mengandungi elemen span

15. kaedah slice(): $('p').slice(0,2) ---- Cari elemen p pertama Kepada elemen p ketiga

16. kaedah offsetParent(): $('p').offsetParent() --- Cari elemen nenek moyang kedudukan pertama bagi elemen p

17. kaedah parent(): $('p').parent( ) ---- Mengembalikan set elemen yang mengandungi nod induk unik bagi elemen p

18. kaedah ibu bapa(): $('p' ).parent() ---- Mengembalikan semua nod nenek moyang yang mengandungi elemen p (tidak termasuk nod akar)

19 kaedah parentUntil(): $('p').parentUntil('#box') ---- Cari unsur nenek moyang unsur p sehingga #. kotak

20. kandungan() kaedah: $('p').contents() --- Kembalikan semua nod anak dalam elemen p ( Termasuk nod teks)

21. ) kaedah: $('p').find('span').end() ---- Tukar badan pernyataan kembali ke keadaan sebelumnya, iaitu: find Selepas pergi ke elemen span, fokus kembali kepada elemen p

<div>
  <span>Hello</span>,
  how are you?
</div>
<script type="text/javascript">
  $(&#39;div&#39;).find(&#39;span&#39;).addClass(&#39;test&#39;).end().attr(&#39;title&#39;,&#39;title1&#39;);
  //span添加class=test;div添加title=title1
</script>

[Pembelajaran yang disyorkan: tutorial video jQuery, bahagian hadapan web]

Atas ialah kandungan terperinci Apakah kaedah yang ada untuk melintasi nod dalam jquery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!