コピペのスニペ・JavaScript「ElementのStyleを取得」

Pocket
LINEで送る
GREE にシェア
LinkedIn にシェア

ページ内で、特定のElementが今どういうstyleが適用されているかを取得する関数を作ってみました。

簡単に取得するには、

という風に、エレメントのpropertyを辿って行くことで取得できるのですが、外部CSSの記述はこの方法では拾えません。
さらに、camarizeという処理を加えないといけないことから、バグにつながる可能性も高いので、propertyからの取得はあまりおすすめできません。

ケース

表示・非表示トグル

ソフトアラートや、フローティングダイアログなどの”display:none”と”display:block”をtoggleで入れ替えるような処理の場合、対象のelementのdisplay値を取得すれば問題はないのですが、外部cssファイルでの記述の場合は、この関数を使うことで取得できるようになります。

背景色の取得

入力フォームで、エラーの場合に背景色を赤くする場合に、今どういう状態かをカラーの取得で判定することも可能です。

ソース

使い方

Leave a Reply

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です