JavaScript のメソッドと擬似要素 (Pseudo-Element) 属性を取得する手法_JavaScript 手法

CSS 疑似要素は非常に便利です。これを使用して CSS 三角形を作成したり、ツールチップで使用したり、追加の HTML 要素を必要とせずに多くの単純なタスクを完了することもできます。以前は、JavaScript を使用して疑似要素の CSS プロパティにアクセスできませんでしたが、現在は、疑似要素にアクセスするための新しい JavaScript メソッドが用意されています。 CSS コードが次のようになっていると仮定します:

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

.要素:前 {
コンテンツ: '新規';
カラー: rgb(255, 0, 0);
}

.element:before のスタイル属性を取得するには、次の JavaScript コードを使用できます:

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

var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color')

window.getComputedStyle メソッドの第 2 パラメータとして疑似要素を使用すると、疑似要素のスタイルで属性を取得できます。このヒントをナレッジ ベースに加えてください。ブラウザが進化するにつれて、疑似要素はますます便利になるでしょう。