Anda dapat menggunakan pemilih atribut CSS untuk menemukan elemen HTML berdasarkan nilai atribut datanya menggunakan jQuery. Pemilih atribut memberikan cara yang sangat ampuh untuk memilih elemen
Mari kita lihat contoh berikut untuk memahami cara kerjanya
jQuery Selecting Element by Data Attribute Slide:
FAQ Terkait
Berikut adalah beberapa FAQ lainnya yang terkait dengan topik ini
Pada artikel ini, kita akan belajar mendapatkan elemen anak dari induk menggunakan Javascript. Diberikan dokumen HTML dan tugasnya adalah memilih elemen tertentu dan mendapatkan semua elemen anak dari elemen induk dengan bantuan JavaScript. Untuk ini, ada 2 cara untuk mendapatkan elemen anak
- Dengan menggunakan properti anak-anak
- Dengan menggunakan Metode querySelector
Kami akan membahas kedua pendekatan & memahami penerapannya melalui contoh
Properti anak-anak DOM digunakan untuk mengembalikan koleksi HTML dari semua elemen anak dari elemen yang ditentukan.
Pendekatan 1
- Pilih elemen yang elemen anaknya akan dipilih
- Menggunakan. properti anak-anak untuk mendapatkan akses ke semua anak elemen
- Pilih anak tertentu berdasarkan indeks
Contoh 1. Contoh ini mengimplementasikan. properti anak-anak untuk mendapatkan koleksi HTML dari semua elemen anak dari elemen yang ditentukan
HTML
<!DOCTYPE HTML>_
<html>
<head>
<<0<1<0>
<<_6>
<_9
html0html1
html0html3
html5
html6
html8
html0>0
html0html3
html0>4
html5
>8<6>
>8head>
< 6 <6 8 9>
<<3 <6 8<6<7
html0<9
>8<3>
<head6 head7 8head9 <6 8>2html3_______51head6>
Dalam HTML DOM (Document Object Model), dokumen HTML adalah kumpulan node dengan (atau tanpa) node anak
Node adalah node elemen, node teks, dan node komentar
Spasi antar elemen juga merupakan node teks
Elemen hanyalah node elemen
childNodes vs anak-anak
childNodes mengembalikan node anak (node elemen, node teks, dan node komentar)
children mengembalikan elemen anak (bukan teks dan simpul komentar)
Saudara kandung vs Saudara Elemen
Saudara kandung adalah "saudara" dan "saudara perempuan"
Sibling adalah node dengan induk yang sama (dalam daftar childNodes yang sama)
Saudara Elemen adalah elemen dengan induk yang sama (dalam daftar anak yang sama)
Sintaksis
Nilai Pengembalian
TypeDescriptionObjectA Kumpulan objek NodeList dari nodeNode diurutkan saat muncul di dokumen
Lebih Banyak Contoh
Ubah warna latar belakang simpul anak kedua
elemen. simpulanak[1]. gaya. warna latar = "kuning";
Cobalah sendiri "Dapatkan teks simpul anak ketiga dari suatu elemen. biarkan teks = dokumen. getElementById("PilihSaya"). simpulanak[2]. teks; . childNodes adalah fitur DOM Level 1 (1998). Ini didukung penuh di semua browser. Chrome Edge Firefox Safari Opera IE Ya Ya Ya Ya Ya 9-11