Cara menggunakan kaedah tambah traversal jQuery-Soal Jawab bahagian hadapan-php.cn

Cara menggunakan kaedah tambah traversal jQuery

PHPz

Lepaskan： 2023-04-17 13:55:24

asal

461 orang telah melayarinya

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 class="box">
  <p>这里是段落1</p>
</div>
<div class="box">
  <p>这里是段落2</p>
</div>

Salin selepas log masuk

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

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

Salin selepas log masuk

Kini, $newCollection akan mengandungi semua elemen  dan <div>.

Elemen DOM Traverse

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.

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.

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

Salin selepas log masuk

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

Salin selepas log masuk

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()

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