js怎麼取得css屬性

js取得css屬性的方法：使用【getComputedStyle(div)】方法取得，程式碼為【var a = document.defaultView.getComputedStyle(div);】。

【相關文章推薦：#vue.js##】

js取得css屬性的方法：

在使用原生js做開發的時候，你應該會遇到需要取得css屬性，然後發現好像直接取得是不行的。這裡提供兩種在原生js中取得css屬性的方法

直接取得會失敗，舉個栗子

window.onload = function() {
var but = document.getElementById('button');
var div = document.getElementById('getStyle');
but.onclick = function() {
alert(div.style.width);//弹出空的对话框
}
}

使用getComputedStyle(div)方法

##用法範例

window.onload = function() {
var but = document.getElementById('button');
var div = document.getElementById('getStyle');
but.onclick = function() {
var a = document.defaultView.getComputedStyle(div);
alert(a.width);//100px
}
}

注意事項

1. 取得到的是瀏覽器計算後的樣式，如果你去取得background,你會得到下面結果

alert(a.background);//reb(255,0,0) none repeat sroll 0% 0% / auto padding-box border-box

所以請清楚指明你要取得的樣式，像這樣

alert(a.backgroundColor);//red

2. 寫名字的時候不要有空格

'div'不可以是' div'

##3. 不要取得未設定的樣式，不相容

解決相容性：ie8一下版本不能使用getComputedStyle方法，而要用currenrStyle方法

a = div.currentStyle;
alert(a.width);

##相關免費學習推薦：

javascript（影片）

以上是js怎麼取得css屬性的詳細內容。更多資訊請關注PHP中文網其他相關文章！