Bolehkah Anda Menyasarkan Elemen Berdasarkan Kehadiran Sebarang Atribut 'data-*' dengan CSS?

Pemilihan Nama Atribut dengan Wildcarding

Dalam pembangunan web, pemilih CSS menawarkan kawalan tepat ke atas elemen HTML berdasarkan atribut mereka. Di antara pelbagai pemilih berasaskan atribut, wujud keperluan khusus untuk elemen penyasaran yang mempunyai sebarang atribut "data-*". Walaupun pelbagai kaedah wujud untuk memilih elemen berdasarkan nilai atribut, persoalan timbul: bolehkah kita menyasarkan elemen semata-mata berdasarkan kehadiran mana-mana atribut "data"?

Untuk memahami kemungkinan semasa, mari kita periksa atribut sedia ada pemilih berasaskan nilai:

• Padanan Tepat: Memilih elemen di mana nilai atribut sama nilai yang ditentukan ([data-something="value"]).
• Padanan Separa (Mula): Memilih elemen di mana nilai atribut bermula dengan awalan tertentu ([data-something^ ="value"]).
• Padanan Separa (Tamat): Memilih elemen di mana nilai atribut berakhir dengan akhiran ditentukan ([data-something$="value"]).
• Padanan Separa (Di Mana-mana): Memilih elemen di mana nilai atribut mengandungi subrentetan tertentu ([data-something*= "nilai"]).

Walau bagaimanapun, untuk kes tertentu elemen penyasaran berdasarkan nama atribut itu sendiri, hanya terdapat satu pilihan:

• Nama Atribut Hadir: Memilih elemen yang mempunyai atribut tertentu ([data-sesuatu]).

Malangnya, terdapat pada masa ini tiada pemilih kad bebas untuk nama atribut, seperti [data-*]. Ini bermakna tidak mungkin untuk menyasarkan elemen yang mempunyai sebarang atribut "data" menggunakan CSS sahaja.

Walau bagaimanapun, terdapat usaha berterusan dalam Spesifikasi Tahap 3 Pemilih untuk memperkenalkan keupayaan kad liar untuk nama atribut. Sintaks yang dicadangkan yang telah mendapat daya tarikan ialah:

• x-admin-*: Memilih elemen dengan nama atribut bermula dengan "x-admin-".
• [data-my-*]: Memilih elemen dengan nama atribut bermula dengan "data-my-".

Walaupun pemilih ini belum lagi menjadi sebahagian daripada piawaian, mereka menunjukkan potensi untuk menukar nama atribut pada masa hadapan.

Atas ialah kandungan terperinci Bolehkah Anda Menyasarkan Elemen Berdasarkan Kehadiran Sebarang Atribut 'data-*' dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!