如何在 CSS 中嵌入 JavaScript 功能？

在 CSS 中嵌入 JavaScript

虽然不可能直接在 CSS 中执行 JavaScript，但有一些创造性的技术可以实现类似的功能。

IE：表达技术和 HTC行为

Internet Explorer 提供两种方法：

• 表达式技术： 涉及创建一个计算 JavaScript 表达式的表达式。例如：

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

• HTC 行为： 利用通过 CSS 加载的单独 XML 文件 (script.htc)。在 HTC 文件内，可以执行 JavaScript。

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 提供了一个类似的基于 XML 的解决方案，称为 XBL .

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

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

  <binding>

重要注意事项

• 仅当 CSS 选择器与文档中的元素匹配时才执行 JavaScript。
• 这些技术尚未标准化，可能不适用于所有浏览器。
• 它们可能会带来安全隐患，因此请谨慎使用。

以上是如何在 CSS 中嵌入 JavaScript 功能？的详细内容。更多信息请关注PHP中文网其他相关文章！