Saya ingin menerapkan gaya ke div tertentu. Misalnya pada waktu buka semua dengan kelas foo akan ditampilkan, tetapi saya mungkin ingin mengalihkan satu instance kelas foo off yang memiliki id bar.
Nicholas Murray
1
Maka Anda hanya akan melakukan $('#bar.foo').toggle();Anda hanya akan memiliki satu id karena DIBUTUHKAN untuk menjadi unik untuk dokumen tersebut. jika Anda ingin hanya mengaktifkan id itu jika itu adalah kelas foomaka tambahkan saja kelas itu ke pemilih id. jika selektor menemukan himpunan kosong tidak akan terjadi apa-apa, jika selektor menemukan himpunan dengan hasil (yang hanya akan ada satu) maka itu akan mengalihkan elemen. Saya pikir Anda terlalu memikirkan ini.
ajaib
3
hanya untuk mengatakan itu membuat frustrasi orang mengatakan "mengapa kamu ingin melakukan itu?" ketika saya mencoba melakukan ini sekarang. Masalah dengan hasClass adalah ia mengembalikan True jika SETIAP elemen yang cocok dengan selektor memiliki kelas yang diberikan. Jadi di mana saya memiliki banyak p dengan kelas "kue" dan nama kelas tambahan untuk masing-masing ("satu", "dua" dll) Saya mengalami masalah. Saya ingin memilih set umum p.cake dan kemudian memiliki persyaratan (jika class = "one" - $ var = 23 - etc). Intinya adalah saya mencoba mengirimkan $ var yang berbeda tergantung pada nama kelas tambahan. Saya mencoba untuk tidak harus mengulangi seluruhnya
Stella
Jawaban:
171
Anda dapat memasukkan logika tersebut ke dalam selektor dengan menggabungkan beberapa pemilih . Misalnya, kita dapat menargetkan semua elemen dengan id tertentu, yang juga memiliki kelas tertentu:
Ini akan terlihat mirip dengan sesuatu yang Anda tulis di CSS. Perhatikan bahwa ini tidak akan berlaku untuk semua #fooelemen (meskipun seharusnya hanya ada satu), dan tidak akan berlaku untuk semua .barelemen (meskipun mungkin ada banyak). Ini hanya akan mereferensikan elemen yang memenuhi syarat di kedua atribut.
jQuery juga memiliki .ismetode hebat yang memungkinkan Anda menentukan apakah suatu elemen memiliki kualitas tertentu. Anda dapat menguji koleksi jQuery terhadap pemilih string, Elemen HTML, atau objek jQuery lainnya. Dalam kasus ini, kami hanya akan memeriksanya dengan pemilih string:
$(".bar:first").is("#foo");// TRUE if first '.bar' in document is also '#foo'
Mungkin kode tersebut akan menjadi fungsi panggilan balik yang perlu menangani kasus tertentu secara berbeda. Jadi, fungsi tersebut meneruskan objek jQuery secara otomatis dengan atribut yang tidak diketahui. Dalam hal ini, $ ('your answer'). Is ('helpful');
Peter G
1
Saya bisa memikirkan sejumlah alasan. Bagaimana jika Anda ingin menerapkan setelan khusus seluler, seperti jika suatu elemen memiliki id = "mobile". Mengapa tidak penting.
dipasang
Yah, hanya 1 elemen yang harus diberikan idjika tidak maka harus ada atribut lain ... Saya kira jika lokasi struktural elemen yang dimaksud berubah berdasarkan halaman atau klien / agen pengguna maka ok, tetapi selain itu .. .
ajaib
19
update: maaf salah paham pertanyaan, .has()jawaban dihapus .
Cara alternatif lain, buat .hasId()plugin
// the plugin
$.fn.hasId =function(id){returnthis.attr('id')== id;};// select first class
$('.mydiv').hasId('foo')?
console.log('yes'): console.log('no');// select second class// $('.mydiv').eq(1).hasId('foo')// or
$('.mydiv:eq(1)').hasId('foo')?
console.log('yes'): console.log('no');
Maaf, tapi saya rasa Anda salah menafsirkan pertanyaan: has () API melaporkan ini: Kurangi kumpulan elemen yang cocok menjadi yang memiliki turunan yang cocok dengan pemilih atau elemen DOM. OP menanyakan bagaimana cara menguji apakah elemen dengan kelas 'myDiv' juga memiliki Id foo, sementara has () akan mencari turunan dari 'myDiv' yang memiliki Id 'foo'.
Miringkan
7
Katakanlah Anda melakukan iterasi melalui beberapa objek DOM dan Anda ingin menemukan dan menangkap elemen dengan ID tertentu
Kode yang sama dapat dengan mudah dimodifikasi untuk pemilih kelas.
<divid="myDiv"><divclass="fo"><div><divclass="bar"><div><divclass="fo"><div><divclass="bar"><div><divclass="fo"><div><divclass="bar"><div></div>
$('#myDiv div').each(function() {
if($(this).hasClass('bar'))
//do something with bar
});
Saya senang Anda memecahkan masalah Anda dengan index (), apa pun yang berhasil untuk Anda. Saya harap ini akan membantu orang lain dengan masalah yang sama. Bersulang :)
masing-masing tidak dibutuhkan karena tidak akan pernah ada lebih dari satu #theMysteryId.
ajaib
2
Nah itu menghemat masalah untuk menugaskannya ke variabel, memeriksa untuk melihat apakah panjangnya tidak kosong, dan kemudian melanjutkan dengan kode. Jika selektor tidak cocok, jQuery tidak akan memanggil fungsi "setiap", jadi ini bagus dan bersih. Sekarang jika semua yang ingin Anda lakukan adalah memanggil beberapa jQuery API, tentu saja.
Pointy
4
Hanya untuk mengatakan saya akhirnya menyelesaikan ini menggunakan index ().
TIDAK ADA yang sepertinya berhasil.
Jadi untuk elemen saudara ini adalah solusi yang baik jika Anda pertama kali memilih oleh kelas umum dan kemudian ingin memodifikasi sesuatu yang berbeda untuk masing-masing kelas tertentu.
EDIT: bagi mereka yang tidak tahu (seperti saya) index () memberikan nilai indeks untuk setiap elemen yang cocok dengan selector, dihitung dari 0, tergantung urutannya di DOM. Selama Anda tahu berapa banyak elemen dengan class = "foo", Anda tidak memerlukan id.
Jelas ini tidak selalu membantu, tetapi seseorang mungkin merasa berguna.
$('#bar.foo').toggle();
Anda hanya akan memiliki satu id karena DIBUTUHKAN untuk menjadi unik untuk dokumen tersebut. jika Anda ingin hanya mengaktifkan id itu jika itu adalah kelasfoo
maka tambahkan saja kelas itu ke pemilih id. jika selektor menemukan himpunan kosong tidak akan terjadi apa-apa, jika selektor menemukan himpunan dengan hasil (yang hanya akan ada satu) maka itu akan mengalihkan elemen. Saya pikir Anda terlalu memikirkan ini.Jawaban:
Anda dapat memasukkan logika tersebut ke dalam selektor dengan menggabungkan beberapa pemilih . Misalnya, kita dapat menargetkan semua elemen dengan id tertentu, yang juga memiliki kelas tertentu:
Ini akan terlihat mirip dengan sesuatu yang Anda tulis di CSS. Perhatikan bahwa ini tidak akan berlaku untuk semua
#foo
elemen (meskipun seharusnya hanya ada satu), dan tidak akan berlaku untuk semua.bar
elemen (meskipun mungkin ada banyak). Ini hanya akan mereferensikan elemen yang memenuhi syarat di kedua atribut.jQuery juga memiliki
.is
metode hebat yang memungkinkan Anda menentukan apakah suatu elemen memiliki kualitas tertentu. Anda dapat menguji koleksi jQuery terhadap pemilih string, Elemen HTML, atau objek jQuery lainnya. Dalam kasus ini, kami hanya akan memeriksanya dengan pemilih string:sumber
is()
. Harus ada.hasId()
pemilih hanya karena tampaknya seperti mitra yang jelas untuk.hasClass()
benar - benar ...Saya mungkin akan menggunakan
$('.mydiv').is('#foo');
Yang mengatakan jika Anda tahu Id mengapa Anda tidak menerapkannya ke pemilih di tempat pertama?sumber
id
jika tidak maka harus ada atribut lain ... Saya kira jika lokasi struktural elemen yang dimaksud berubah berdasarkan halaman atau klien / agen pengguna maka ok, tetapi selain itu .. .update: maaf salah paham pertanyaan,
.has()
jawaban dihapus .Cara alternatif lain, buat
.hasId()
pluginsumber
Katakanlah Anda melakukan iterasi melalui beberapa objek DOM dan Anda ingin menemukan dan menangkap elemen dengan ID tertentu
Anda juga dapat menulis sesuatu seperti menemukan
Perhatikan bahwa jika Anda menggunakan pemilih kelas, metode find akan mengembalikan semua elemen yang cocok.
atau Anda bisa menulis fungsi iterasi yang akan melakukan pekerjaan lebih lanjut
Kode yang sama dapat dengan mudah dimodifikasi untuk pemilih kelas.
Saya senang Anda memecahkan masalah Anda dengan index (), apa pun yang berhasil untuk Anda. Saya harap ini akan membantu orang lain dengan masalah yang sama. Bersulang :)
sumber
sumber
#theMysteryId
.Hanya untuk mengatakan saya akhirnya menyelesaikan ini menggunakan index ().
TIDAK ADA yang sepertinya berhasil.
Jadi untuk elemen saudara ini adalah solusi yang baik jika Anda pertama kali memilih oleh kelas umum dan kemudian ingin memodifikasi sesuatu yang berbeda untuk masing-masing kelas tertentu.
EDIT: bagi mereka yang tidak tahu (seperti saya) index () memberikan nilai indeks untuk setiap elemen yang cocok dengan selector, dihitung dari 0, tergantung urutannya di DOM. Selama Anda tahu berapa banyak elemen dengan class = "foo", Anda tidak memerlukan id.
Jelas ini tidak selalu membantu, tetapi seseorang mungkin merasa berguna.
sumber
Periksa apakah ID elemen ada
sumber
Anda juga dapat memeriksa apakah elemen id digunakan dengan melakukannya:
Saya menggunakan metode ini untuk dataTables global dan dataTables terurut tertentu
sumber