Comment puis-je intégrer la fonctionnalité JavaScript dans CSS ?

Intégration de JavaScript dans CSS

Bien qu'il ne soit pas directement possible d'exécuter du JavaScript dans CSS, il existe des techniques créatives qui permettent des fonctionnalités similaires.

IE : Technique d'expression et comportement HTC

Internet Explorer fournit deux méthodes :

• Technique d'expression : Implique la création d'une expression qui évalue une expression JavaScript. Par exemple :

body {
  color: (function() { return document.getElementById("button").style.color; })();
}

• Comportement HTC : Utilise un fichier XML distinct (script.htc) chargé via CSS. À l'intérieur du fichier HTC, JavaScript peut être exécuté.

body {
  behavior:url(script.htc);
}

<PUBLIC:COMPONENT TAGNAME="xss">
   <PUBLIC:ATTACH EVENT="ondocumentready" ONEVENT="main()" LITERALCONTENT="false"/>
</PUBLIC:COMPONENT>

<SCRIPT>
  function main() {
    alert("HTC script executed.");
  }
</SCRIPT>

Firefox : XBL

Firefox propose une solution similaire basée sur XML appelée XBL. .

body {
  -moz-binding: url(script.xml#mycode);
}

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

  <binding>

Important Considérations

• JavaScript est exécuté uniquement lorsque le sélecteur CSS correspond à un élément du document.
• Ces techniques ne sont pas standardisées et peuvent ne pas fonctionner dans tous les navigateurs.
• Ils peuvent introduire des implications en matière de sécurité, alors utilisez-les avec prudence.

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!