JavaScript で CSS ルールの内容を取得するにはどうすればよいですか?

CSS ルールのコンテンツの取得

CSS ルールの値にアクセスする方法を知ることは、動的なスタイル設定やプレゼンテーションの操作に役立ちます。あなたの要素。

CSS ルールのすべての内容を含む文字列をインライン スタイル形式で返すには、次の方法を使用できます:

function getStyle(className) {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">var cssText = "";
var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
for (var x = 0; x < classes.length; x++) {        
    if (classes[x].selectorText == className) {
        cssText += classes[x].cssText || classes[x].style.cssText;
    }         
}
return cssText;

ログイン後にコピー

}

alert(getStyle('.test'));

このコード内:

• getStyle は、CSS クラス名を入力として受け取り、そのルール値を含む文字列を返す関数です。そのクラス。
• classes は、ドキュメントの最初のスタイルシートにあるすべての CSS ルールの配列です。
• ループはルールを反復処理し、selectorText プロパティ (関連付けられたセレクターが含まれているかどうかを確認します)
• 一致が見つかった場合、cssText プロパティ (ルールのインライン表現を含む) が追加されます
• 最後に、cssText 変数が返され、アラート ボックスに表示されます。

以上がJavaScript で CSS ルールの内容を取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。