DOMに外部cssで適用されてるstyleが取りたいっ!
2018年8月7日
タイトルの通りですが、以下のようなhtmlがあった時に
<div class="list" id="main_list"> <p>hogehoge</p> </div>
このdivのstyleが取りたい時に、
const div = document.getElementById('main_list'); console.log(div.style);
これだと、attributeとして直接書いてあるstyleであれば取れるんですが、classで指定されているstyleが取れないので、
window.getComputedStyleを使う。
const div = document.getElementById('main_list'); console.log( window.getComputedStyle(div) );
例えば、colorが欲しければ、
const div = document.getElementById('main_list'); const color = window.getComputedStyle(div).color;
こんな感じですかね。