Javascript peut-il être intégré dans CSS ?

Javascript en CSS : explorer les possibilités

Bien que les domaines CSS et Javascript fonctionnent généralement séparément, il est possible de combler le fossé dans certains navigateurs Web. Voici un aperçu détaillé de la manière dont IE et Firefox vous permettent d'intégrer la fonctionnalité Javascript dans votre CSS :

Comportement HTC (IE) :

Le comportement HTC vous permet d'inclure un script sous forme de fichier XML dans votre CSS. En définissant une règle CSS comme body {behavior:url(script.htc);}, vous pouvez charger le fichier XML externe dans votre corps HTML. Dans le fichier XML, vous pouvez définir un composant et spécifier un gestionnaire d'événements comme ondocumentready pour déclencher votre code Javascript.

Exemple :

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 exploite XBL (Extensible Binding Language) pour intégrer des scripts dans CSS. En utilisant une règle CSS comme body {-moz-binding: url(script.xml#mycode);}, vous pouvez lier un fichier XML à votre sélecteur CSS. Dans le fichier XML, définissez une liaison avec une implémentation qui contient le code Javascript que vous souhaitez exécuter.

Exemple :

script.xml :

<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:html="http://www.w3.org/1999/xhtml">

<binding>

Limitations :

C'est Il est important de noter que dans les deux techniques, le code Javascript ne s'exécute que lorsque le sélecteur CSS correspond à un élément de la page. Par exemple, si vous appliquez les techniques ci-dessus à l'élément body, le code s'exécutera dès le chargement de la page.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!