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

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

coldplay.xixi
リリース: 2020-06-20 16:55:50
転載
3528 人が閲覧しました

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 サイトの他の関連記事を参照してください。

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