ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptを使って擬似要素(Pseudo-Element)の属性を取得する方法を詳しく解説

JavaScriptを使って擬似要素(Pseudo-Element)の属性を取得する方法を詳しく解説

coldplay.xixi
coldplay.xixi転載
2020-06-20 16:55:503425ブラウズ

JavaScriptを使って擬似要素(Pseudo-Element)の属性を取得する方法を詳しく解説

CSS 疑似要素 (疑似要素) は非常に便利です。これを使用して CSS 三角形を作成したり、プロンプト ボックスで使用したり、多くの単純な要素を完成させることもできます。冗長な HTML 要素は必要ありません。以前は、JavaScript を使用して疑似要素の CSS プロパティにアクセスできませんでしたが、現在は、疑似要素にアクセスするための新しい JavaScript メソッドが用意されています。 CSS コードが次のようなものであるとします。

.element:before {
	content: 'NEW';
	color: rgb(255, 0, 0);
}

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

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

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

推奨チュートリアル: 「JavaScript 基本チュートリアル

以上がJavaScriptを使って擬似要素(Pseudo-Element)の属性を取得する方法を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はwebhek.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。