Bolehkah Anda Menggayakan Elemen Berdasarkan HTML Dalamannya dalam CSS?

CSS: Memilih Elemen Berdasarkan HTML Dalaman

Dalam usaha untuk penggayaan web yang tepat, anda mungkin menghadapi keperluan untuk memilih elemen berdasarkan kandungan HTML dalaman mereka. Walau bagaimanapun, anda harus sedar bahawa tugas ini tidak disokong secara asli oleh CSS.

Pertimbangkan contoh di mana anda ingin menggayakan hanya teg sauh kedua dengan "innerHTML2" menggunakan CSS. Walaupun percubaan seperti a[value=innerHTML2], pendekatan ini gagal. CSS tidak mempunyai kefungsian untuk mengakses dan memadankan secara langsung dengan HTML dalaman elemen.

Resolusi

Walaupun mungkin menggoda untuk meninggalkan usaha anda, penyelesaian wujud melalui alam JavaScript dan perpustakaan jQuery. jQuery menyediakan set kaedah yang mantap untuk memanipulasi elemen DOM, termasuk keupayaan untuk memilih elemen berdasarkan kandungan dalaman mereka.

Anda boleh menggunakan pemilih :contains() jQuery untuk menyelesaikan tugas ini. Berikut ialah contoh:

$("a:contains('innerHTML2')").css({"color": "blue"});

Kod ini akan memilih tag anchor dengan HTML dalaman "innerHTML2" dan menggunakan warna biru pada teksnya. Pemilih :contains() jQuery secara cekap memadankan elemen yang mengandungi teks yang ditentukan dalam HTML dalaman mereka.

Ingat bahawa penyelesaian ini memerlukan kemasukan pustaka jQuery dalam dokumen HTML anda. Sebaik sahaja anda menggabungkan jQuery, anda boleh memilih dan menggayakan elemen dengan lancar berdasarkan kandungan HTML dalaman mereka, memperluaskan keupayaan reka bentuk web anda.

Atas ialah kandungan terperinci Bolehkah Anda Menggayakan Elemen Berdasarkan HTML Dalamannya dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!