ホームページ > ウェブフロントエンド > CSSチュートリアル > Javascript を CSS に統合できますか?

Javascript を CSS に統合できますか?

Barbara Streisand
リリース: 2024-12-30 02:25:08
オリジナル
644 人が閲覧しました

Can Javascript Be Integrated into CSS?

CSS における Javascript: 可能性の探求

CSS と Javascript の領域は通常、別々に動作しますが、特定の領域ではギャップを埋めることができます。ウェブブラウザ。ここでは、IE と Firefox で CSS 内に Javascript 機能を統合する方法を詳しく説明します。

HTC 動作 (IE):

HTC 動作により、スクリプトを CSS 内の XML ファイルとして保存します。 body {behavior:url(script.htc);} のような CSS ルールを定義すると、外部 XML ファイルを HTML 本文に読み込むことができます。 XML ファイル内で、コンポーネントを定義し、Javascript コードをトリガーする ondocumentready のようなイベント ハンドラーを指定できます。

例:

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 は XBL (Extensible Binding Language) を利用してスクリプトを CSS に統合します。 body {-moz-binding: url(script.xml#mycode);} のような CSS ルールを使用すると、XML ファイルを CSS セレクターにバインドできます。 XML ファイル内で、必要な Javascript コードを含む実装とのバインディングを定義します。 execute.

例:

script.xml:

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

<binding>
ログイン後にコピー

制限事項:

どちらの手法でも、JavaScript コードがCSS セレクターがページ上の要素と一致する場合にのみ実行されます。たとえば、上記の手法を body 要素に適用すると、ページが読み込まれるとすぐにコードが実行されます。

以上がJavascript を CSS に統合できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート