JS：getComputedStyle方法

由于诸如ele.style.display这样的操作只能获取DOM元素的行内样式，所以获取结果可能与实际显示效果不符

通过getComputedStyle方法可以用来获取DOM元素实际显示时的样式，具体：

let style = window.getComputedStyle(element, [pseudoElt]);

getComputedStyle是window全局对象的一个方法，可以传递两个参数：

第一个参数指定一个用来获取计算样式的DOM元素，

第二个参数（可选）指定一个要匹配的伪元素的字符串，普通元素可省略或传null。

getComputedStyle方法执行会返回一个对象，该对象在包含指定DOM元素（或伪类）计算样式之后（实际显示）的所有CSS属性的值，并且会随着元素的样式更改自动更新，通过使用CSS属性名称进行索引可以获取该CSS属性值。

let element = document.getElementById('ele');
let style = window.getComputedStyle(element);//元素样式改变时会自动更新
let display = style.display;//元素指定样式属性的值
style.width; //元素的width值

注意：在Gecko2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)之前版本，参数pseudoElt是必要的。如果为null，则不指定其他主要浏览器必须指定此参数。Gecko已经更改为匹配其他浏览器的行为。

注： 因getComputedStyle()方法是只读的，故不能通过其去设置样式的属性值，设置样式的属性可通过style对象来解决。

原文：https://blog.csdn.net/qq_28387069/article/details/83118202