Bagaimana menemukan orang tua dengan kelas yang dikenal di jQuery?

244

Saya memiliki <div>yang memiliki banyak lainnya <div>di dalamnya, masing-masing pada tingkat bersarang yang berbeda. Daripada memberikan setiap anak <div>pengenal, saya lebih suka memberikan akar <div>pengenal. Ini sebuah contoh:

<div class="a" id="a5">
  <div class="b">
    <div class="c">
      <a class="d">
      </a>
    </div>
  </div>
</div>

Jika saya menulis fungsi dalam jQuery untuk merespons ke kelas ddan saya ingin mencari ID untuk induknya, kelas a, bagaimana saya melakukan ini?

Saya tidak bisa begitu saja $('.a').attr('id');, karena ada beberapa kelas as. Saya dapat menemukan ID orang tua orangtuanya, tetapi desainnya jelek, lambat, dan tidak terlalu polimorfik (saya harus menulis kode berbeda untuk menemukan ID untuk kelas c).

javascript jquery html dom parent John Smith
sumber

Jawaban:

490

Dengan asumsi bahwa thisadalah .d, Anda dapat menulis

$(this).closest('.a');

The closestMetode mengembalikan induk terdalam dari elemen Anda yang cocok pemilih.

Slaks
sumber
47
Perhatikan bahwa ada sedikit tangkapan: Jika elemen awal Anda juga cocok dengan kueri, Anda tidak mendapatkan elemen induk melainkan elemen yang sama. Ini mungkin atau mungkin bukan perilaku yang diinginkan. Jika tidak, saya merekomendasikan ini: $ (ini) .parent (). Paling dekat ('. A');
Risord
1
Sangat membantu. Saya selalu gunakan untuk melakukan $ (ini) .parent (). Parent (). Parent () dan saya tahu ada solusi yang lebih baik.
Wang'l Pakhrin
28

Lewati pemilih ke fungsi orang tua jQuery :

d.parents('.a').attr('id')

EDIT Hmm, sebenarnya jawabannya Slaks lebih unggul jika Anda hanya ingin nenek moyang terdekat yang cocok pemilih Anda.

Drew Noakes
sumber
8

Anda dapat menggunakan orang tua () untuk mendapatkan semua orang tua dengan pemilih yang diberikan.

Deskripsi: Dapatkan leluhur setiap elemen dalam rangkaian elemen yang cocok saat ini, secara opsional difilter oleh pemilih.

Tetapi parent () hanya akan mendapatkan parent pertama dari elemen.

Deskripsi: Dapatkan induk dari setiap elemen dalam rangkaian elemen yang cocok saat ini, secara opsional difilter oleh pemilih.

jQuery parent () vs. parent ()

Dan ada .parentsUntil () yang saya pikir akan menjadi yang terbaik.

Deskripsi: Dapatkan leluhur setiap elemen dalam rangkaian elemen yang cocok saat ini, hingga tetapi tidak termasuk elemen yang cocok dengan pemilih.

Amr Elgarhy
sumber
Dia hanya ingin orang tua tunggal , jadi dia harus menelepon closest.
SLaks
2

Gunakan .parentsUntil ()

$(".d").parentsUntil(".a");
jai3232
sumber
Itu akan menargetkan setiap elemen induk hingga mencapai elemen induk yang cocok.
Dustin Halstead
0

Diambil dari komentar @ Resord di atas. Yang ini berhasil untuk saya dan lebih dekat dengan pertanyaan itu.

$(this).parent().closest('.a');

Terima kasih

Anjana Silva
sumber