三个方法都能获取元素的样式，不过他们之间还是有差别
1. .style
.style 只能获取元素行内样式
2. getComputedStyle （chrome、火狐）
它可以访问所有样式，即既可以是行内样式，也可以是内嵌或链式样式。它对所有标准浏览器都可用，但 IE6、IE7 和 IE8 不支持该方法。
3. .currentStyle
该属性只对 IE 浏览器有效，对 Chrome 和 FF 浏览器不可用，其主要是用于兼容 IE6、IE7 和 IE8。
兼容写法
const sty = d.currentStyle || window.getComputedStyle(d, null)
测试
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
#bless {
font-size: 20px
}
</style>
<body>
<div id="bless" style="color: rgb(0, 0, 0)">新年快乐</div>
</body>
<script>
var d = document.getElementById('bless')
console.log(d.style.color) // rgb(0, 0, 0)
console.log(d.style.fontSize) // ''
// 兼容
// IE dom元素.currentStyle
// 火狐谷歌 window.getComputedStyle(dom元素, null)
const sty = d.currentStyle || window.getComputedStyle(d, null)
console.log(sty.color) // rgb(0, 0, 0)
console.log(sty.fontSize) // 20px
</script>
</head>
</html>
190
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
