Cara menggunakan kaedah tambah traversal jQuery

jQuery merentasi kaedah tambah

jQuery ialah perpustakaan JavaScript popular yang merangkumi banyak fungsi yang biasa digunakan oleh pembangun, menjadikan pembangunan JavaScript lebih mudah dan lebih cekap. Salah satunya ialah keupayaan untuk merentasi elemen DOM.

Dalam jQuery, terdapat banyak cara untuk mengulang elemen dalam dokumen. Salah satu cara ialah menggunakan kaedah .add().

Apakah kaedah tambah? Kaedah

.add() ialah kaedah yang digunakan oleh jQuery untuk menggabungkan dua atau lebih koleksi. Ia menambah elemen dari satu koleksi ke koleksi yang lain. Set baharu merangkumi semua elemen dalam set asal serta elemen baharu. Kaedah

.add() boleh menerima berbilang parameter, dengan setiap parameter ialah pemilih CSS, elemen DOM atau satu set elemen DOM. Parameter ini akan ditambahkan pada koleksi asal.

Pertimbangkan struktur HTML berikut:

<div>
  <p>这里是段落1</p>
</div>
<div>
  <p>这里是段落2</p>
</div>

Untuk memilih semua <p></p> elemen dan <div> elemen dan menambahnya pada koleksi baharu, gunakan <code>.add() Kaedah:

var $newCollection = $('p').add('div');

Kini, $newCollection akan mengandungi semua elemen <p></p> dan <div>. <h2 id="Elemen-DOM-Traverse">Elemen DOM Traverse</h2> <p>Fungsi traversal jQuery mengembalikan objek jQuery yang mengandungi elemen DOM yang sepadan dengan pemilih yang diberikan. Fungsi ini boleh menapis koleksi, mencari subelemen dan mencari elemen DOM yang sepadan. </p> <p>Berikut ialah kaedah traversal jQuery yang paling biasa digunakan: </p> <ul> <li> <code>.children(): Mengembalikan koleksi elemen anak unsur padanan.

.parent(): Mengembalikan elemen induk langsung bagi elemen padanan.

.siblings(): Mengembalikan set elemen adik-beradik unsur padanan.

.next(): Mengembalikan elemen adik beradik seterusnya bagi elemen padanan.

.prev(): Mengembalikan elemen adik beradik sebelumnya bagi elemen padanan.

Pengumpulan elemen DOM yang dikembalikan oleh kaedah ini boleh dilalui atau diproses selanjutnya menggunakan kaedah jQuery lain.

Contoh berikut menunjukkan cara menggunakan kaedah .siblings() untuk mencari semua elemen adik beradik bagi nama kelas .red:

<div>
  <div>红色盒子</div>
  <div>白色盒子1</div>
  <div>白色盒子2</div>
</div>
<div>
  <div>红色盒子2</div>
  <div>白色盒子3</div>
  <div>白色盒子4</div>
</div>

$(document).ready(function() {
  $('.red').siblings().css('background-color', 'gray');
});

Contoh ini akan Warna latar belakang semua elemen adik-beradik ditetapkan kepada kelabu. .red

Ringkasan

jQuery menyediakan banyak kaedah untuk merentasi elemen DOM untuk memanipulasi HTML dan CSS dengan mudah. Kaedah

boleh menggabungkan dua atau lebih koleksi elemen. .add()

Di atas adalah pengenalan ringkas kepada kaedah jQuery traversal dan

, saya harap ia akan membantu anda. .add()