JavaScript_javascript のヒントでスタイルを取得するためのネイティブ メソッドの概要

追記: これはスタイルを設定するものではなく、スタイルを取得するものです。要素にスタイル値が設定されていない場合は、ブラウザによって指定されたデフォルト値が返されます。 (フォーラムの手配)

1. element.style: は要素タグの style 属性に記述されたスタイル値のみを取得でき、 で定義されたスタイル値は取得できません。 読み込まれたスタイル属性

コードをコピーします コードは次のとおりです:

var ele = document.getElementById('ele');
ele.style.color //色を取得します

2. window.getComputedStyle(): は、現在の要素の最終的な CSS 属性値をすべて取得できます。

コードをコピーします コードは次のとおりです。

window.getComputedStyle("Element", "Pseudo-class");

このメソッドは、計算されたスタイルを取得する要素と擬似要素文字列 (「:before」など) の 2 つのパラメータを受け入れます。疑似要素情報が必要ない場合は、2 番目のパラメータを null にすることができます。 document.defaultView.getComputedStyle("element", "pseudo-class");
を使用することもできます。

コードをコピー コードは次のとおりです:

var ele = document.getElementById('ele');
var style = window.getComputedStyle(ele,null);
style.color; //色を取得します

style.length を通じてブラウザのデフォルト スタイルの数を確認できます。 IE6-8 はこの方法をサポートしていないため、後者の方法を使用する必要があります。 Firefox および Safari の場合、色は rgb 形式に変換されます。

3. element.currentStyle: IE 固有、要素に現在適用されている最終的な CSS 属性値を返します (外部リンク CSS ファイル、ページに埋め込まれている