Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Cara menggunakan kaedah tambah traversal jQuery

Cara menggunakan kaedah tambah traversal jQuery

PHPz
PHPzasal
2023-04-17 11:26:03535semak imbas
<p>jQuery merentasi kaedah tambah

<p>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.

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

Apakah kaedah tambah? Kaedah

<p>.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

<p>.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.

<p>Pertimbangkan struktur HTML berikut:

<div class="box">
  <p>这里是段落1</p>
</div>
<div class="box">
  <p>这里是段落2</p>
</div>
<p>Untuk memilih semua <p> elemen dan <div> elemen dan menambahnya pada koleksi baharu, gunakan .add() Kaedah:

var $newCollection = $('p').add('div');
<p>Kini, $newCollection akan mengandungi semua elemen <p> dan <div>.

Elemen DOM Traverse

<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>Berikut ialah kaedah traversal jQuery yang paling biasa digunakan:

  • .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.
<p>Pengumpulan elemen DOM yang dikembalikan oleh kaedah ini boleh dilalui atau diproses selanjutnya menggunakan kaedah jQuery lain.

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

<div class="box">
  <div class="red">红色盒子</div>
  <div>白色盒子1</div>
  <div>白色盒子2</div>
</div>
<div class="box">
  <div class="red">红色盒子2</div>
  <div>白色盒子3</div>
  <div>白色盒子4</div>
</div>
$(document).ready(function() {
  $('.red').siblings().css('background-color', 'gray');
});
<p>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 <p> boleh menggabungkan dua atau lebih koleksi elemen. .add()

Di atas adalah pengenalan ringkas kepada kaedah jQuery traversal dan <p>, saya harap ia akan membantu anda. .add()

Atas ialah kandungan terperinci Cara menggunakan kaedah tambah traversal jQuery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn