ОК. Я вполне ожидаю, что пойду в огне, чтобы спросить что-то глупое (или хотя бы дублирующее), но в прикрепленном фрагменте, почему я должен использовать window.getComputedStyle для доступа к стилям, применяемым CSS?У меня сложилось впечатление, что поле .style будет, по крайней мере, отражать те стили, которые изначально применялись CSS и / или изменились с тех пор вручную.
Если нет, то какие именно правила определяют, какие свойства отражаются (и когда) в поле .style элемента?
setTimeout(() => {
console.log("the bckg color:", reddish.style.backgroundColor);
console.log("the width:", reddish.style.width);
console.log("from a computed style:", window.getComputedStyle(reddish).backgroundColor);
console.log("from a computed style:", window.getComputedStyle(reddish).width);
}, 100);
#reddish {
background-color: #fa5;
width: 100px;
height: 100px;
}
<html>
<body>
<div id="reddish"></div>
</body>
</html>