溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
小編給大家分享一下js如何獲取css屬性，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！
js獲取css屬性的方法：使用【getComputedStyle(div)】方法獲取，代碼為【var a = document.defaultView.getComputedStyle(div);】。
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);
看完了這篇文章，相信你對js如何獲取css屬性有了一定的了解，想了解更多相關知識，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
