JS獲取元素計算過后的樣式

獲取元素計算過后的樣式

Window.getComputedStyle()

方法會在一個元素應用完有效樣式且計算完所有屬性的基本值之后給出所有 CSS 屬性的值。

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

element：用於獲取計算養殖的element

pseudoElt：可選，指定一個更匹配的偽元素的字符串，必須對普通元素省略或null

返回值：是指指定元素或偽元素的所有屬性的集合

如果沒有偽元素，，偽元素這個參數是可以省略的，或者寫null，但是為了兼容，null不要省略

瀏覽器兼容：

IE8不支持

需要使用currentStyle獲取當前樣式的任意屬性值

element.currentStyle

在IE低版本可用。

 

兼容寫法

  //兼容的獲取當前樣式的任意屬性值
    function getStyle(element) { if(window.getComputedStyle){ return window.getComputedStyle(element,null); }else { return element.currentStyle; } } //獲取對應的屬性的值
   function getStyle_2(element,attr) { if(window.getComputedStyle){ return window.getComputedStyle(element,null)[attr]; }else { return element.currentStyle[attr]; } }