Javascript dalam CSS: Meneroka Kemungkinan
Walaupun alam CSS dan Javascript biasanya beroperasi secara berasingan, adalah mungkin untuk merapatkan jurang dalam tertentu pelayar web. Berikut ialah pandangan terperinci tentang cara IE dan Firefox membenarkan anda menyepadukan kefungsian Javascript dalam CSS anda:
Gelagat HTC (IE):
Gelagat HTC membolehkan anda memasukkan skrip sebagai fail XML dalam CSS anda. Dengan mentakrifkan peraturan CSS seperti body {behavior:url(script.htc);}, anda boleh memuatkan fail XML luaran ke dalam badan HTML anda. Dalam fail XML, anda boleh mentakrifkan komponen dan menentukan pengendali acara seperti odocumentready untuk mencetuskan kod Javascript anda.
Contoh:
script.htc:
<PUBLIC:COMPONENT TAGNAME="xss"> <PUBLIC:ATTACH EVENT="ondocumentready" ONEVENT="main()" LITERALCONTENT="false"/> </PUBLIC:COMPONENT> <SCRIPT> function main() { alert("HTC script executed."); } </SCRIPT>
XBL (Firefox):
Firefox memanfaatkan XBL (Extensible Binding Language) untuk menyepadukan skrip ke dalam CSS. Dengan menggunakan peraturan CSS seperti badan {-moz-binding: url(script.xml#mycode);}, anda boleh mengikat fail XML pada pemilih CSS anda. Dalam fail XML, tentukan pengikatan dengan pelaksanaan yang mengandungi kod Javascript yang anda mahu laksanakan.
Contoh:
skrip.xml:
<?xml version="1.0"?> <bindings xmlns="http://www.mozilla.org/xbl" xmlns:html="http://www.w3.org/1999/xhtml"> <binding>
Penghadan:
Adalah penting untuk ambil perhatian bahawa dalam kedua-dua teknik, kod Javascript hanya dilaksanakan apabila pemilih CSS sepadan dengan elemen pada halaman. Contohnya, jika anda menggunakan teknik di atas pada elemen badan, kod akan dilaksanakan sebaik sahaja halaman dimuatkan.
Atas ialah kandungan terperinci Bolehkah Javascript Disepadukan ke dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!