jQuery Penelusuran - Metode next()

Panduan Lengkap Penelusuran jQuery

Contoh

Cari elemen saudara berikutnya untuk setiap paragraf, hanya memilih paragraf dengan kelas "selected":

$("p").next(".selected").css("background", "yellow");

Coba sendiri

Definisi dan penggunaan

next() mendapatkan elemen saudara yang mendekati untuk setiap elemen dalam koleksi yang cocok. Jika pemilih disediakan, elemen saudara yang cocok dengan pemilih akan diambil kembali.

Sintaks

.next(selector)
Parameter Deskripsi
selector Nilai string, berisi ekspresi pemilih yang digunakan untuk mencocokkan elemen.

Keterangan detil

Jika diberikan objek jQuery yang mewakili koleksi elemen DOM, metode .next() memungkinkan kami untuk mencari elemen saudara yang mengikuti di pohon DOM, dan membangun objek jQuery yang cocok untuk elemen yang cocok.

Metode ini menerima ekspresi pemilih pilihan, jenis yang sama seperti yang saya kirim ke fungsi $(). Jika elemen saudara yang mengikuti cocok dengan pemilih, mereka akan tinggal di dalam objek jQuery yang dibangun kembali; jika tidak, mereka akan dihapus.

Berpikir tentang halaman di bawah ini yang memiliki daftar sederhana:

<ul>
   <li>item daftar 1</li>
   <li>item daftar 2</li>
   <li class="third-item">item daftar 3</li>
   <li>item daftar 4</li>
   <li>item daftar 5</li>
</ul>

Jika kami mulai dari proyek ketiga, maka kami dapat menemukan elemen yang muncul setelahnya:

$('li.third-item').next().css('background-color', 'red');

Coba sendiri

Hasil pemanggilan kali ini adalah, proyek 4 diatur dengan latar belakang merah. Karena kami belum menerapkan ekspresi pemilih, elemen yang mengikuti sangat jelas termasuk sebagai bagian dari objek. Jika kami sudah menerapkan pemilih, pengujian apakah cocok akan dilakukan sebelum disertakan.

Panduan Lengkap Penelusuran jQuery