Temukan semua elemen dengan nilai atribut tertentu di jquery

90

Saya perlu menemukan semua elemen yang memiliki nilai atribut khusus.

Ini div yang perlu saya temukan (saya punya banyak di antaranya ..)

<div imageId='imageN'>...

Saya hanya perlu melakukan loop melalui div yang memiliki imageId='imageN'

jquery

— Pabuc
sumber

6

Saya akan merekomendasikan penggunaan class="imageN"demi HTML yang valid. Entah itu atau data-imageId="imageN"demi HTML5 yang valid. Dengan yang pertama, Anda dapat menggunakan pemilih kelas.

— Andy E

Andy, alasan di balik ini adalah, div ini ditambahkan secara dinamis dari belakang kode dan memiliki ImageIds berbeda tetapi kelas yang sama '.

— Pabuc

3

Anda dapat memiliki banyak kelas class="image imageN"jika itu membantu.

— Val

Mengapa tidak memilih nama kelas lalu jika mereka sudah memiliki kelas yang sama?

— Praxis Ashelin

145

$('div[imageId="imageN"]').each(function() {
    // `this` is the div
});

Untuk memeriksa keberadaan satu-satunya atribut, apa pun nilainya, Anda dapat menggunakan selektor ini sebagai gantinya: $('div[imageId]')

— ThiefMaster
sumber

4

@ ThiefMaster - Jika nilai atribut tidak konstan, (yaitu akan bervariasi) lalu bagaimana menemukannya?

— Pengembang

beberapa pertanyaan: 1- bagaimana dengan elemen lain ... 2- bagaimana dengan nilai lainnya ... Saya mungkin memiliki atribut data-food pada banyak elemen: div, img dan td, di mana masing-masing memiliki nilai yang berbeda.

— dsdsdsdsd

@ParthoGanguly Anda menggunakan variabel dengan cara ini: $ ('div [imageId = "' + variableName + '"]')

— Kama

1

Solusi ini tidak benar-benar menjawab judul halaman ini. Anda mencari elemen yang div. Solusi yang tepat adalah solusi yang agnostik dari elemen yang sebenarnya.

— AndroidDev

166

Meskipun tidak secara tepat menjawab pertanyaan tersebut, saya sampai di sini ketika mencari cara untuk mendapatkan kumpulan elemen (nama tag yang berpotensi berbeda) yang hanya memiliki nama atribut tertentu (tanpa memfilter berdasarkan nilai atribut). Saya menemukan bahwa berikut ini bekerja dengan baik untuk saya:

$("*[attr-name]")

Harapan yang membantu seseorang yang kebetulan mendarat di halaman ini mencari hal yang sama dengan saya :).

Pembaruan: Tampaknya tanda bintang tidak diperlukan, yaitu berdasarkan beberapa tes dasar, berikut ini tampaknya setara dengan yang di atas (terima kasih kepada Matt untuk menunjukkan ini):

$("[attr-name]")

— sammy34
sumber

Sempurna! Hanya apa yang saya cari.

— Paulius Matulionis

Sangat mungkin ... Saya tidak memeriksa aspek kinerja (bukan faktor penting untuk saya gunakan saat itu).

— sammy34

3

Apakah ada perbedaan antara itu dan $("[attr-name]")? (yaitu tidak *)

— Matius

Ya, ada perbedaan tertentu di antara mereka. Notasi bintang menimbulkan kesalahan pada firefox !!!! (Tidak lolos ...)

— ozz

$("[data-toggle='modal']")

— selain

12

Ini tidak disebut tag; apa yang Anda cari disebut atribut html.

$('div[imageId="imageN"]').each(function(i,el){
  $(el).html('changes');
  //do what ever you wish to this object :) 
});

— Val
sumber

5

Anda dapat menggunakan nilai parsial atribut untuk mendeteksi elemen DOM menggunakan tanda (^). Misalnya Anda memiliki div seperti ini:

<div id="abc_1"></div>
<div id="abc_2"></div>
<div id="xyz_3"></div>
<div id="xyz_4"></div>...

Anda dapat menggunakan kode:

var abc = $('div[id^=abc]')

Ini akan mengembalikan array DOM div yang memiliki id dimulai dengan abc:

<div id="abc_1"></div>
<div id="abc_2"></div>

Ini demonya: http://jsfiddle.net/mCuWS/

— Krunal
sumber

4

Gunakan penggabungan string. Coba ini:

$('div[imageId="'+imageN +'"]').each(function() {
    $(this);   
});

— LostSenSS
sumber