1、通过dom.style.属性 来获取
但是这种方法无法获取id、class里的属性
例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#c1
{
background-color: red;
color: black;
}
</style>
</head>
<body>
<h1 id="c1" >ss</h1>
<h2 id="c2" style="background-color: red;" >222</h2>
<script>
var dom = document.getElementById("c1");
var dom2 = document.getElementById("c2");
console.log(dom.style.backgroundColor);//为空
console.log(dom2.style.backgroundColor);//输出red,如果style中的颜色用rgba形式表示，输出的也是rgba形式
</script>
</body>
</html>
2、在IE中用的是dom.currentStyle,标准下用的是dom.getComputedStyle
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#c1
{
background-color: #FF0000;
color: white;
}
</style>
</head>
<body>
<h1 id="c1" >ss</h1>
<script>
var dom = document.getElementById("c1");
if(window.getComputedStyle)//判断是否存在getComputedStyle方法
{
var str = document.defaultView.getComputedStyle(dom,null).color;
console.log(str);
}
else if(dom.currentStyle)//兼容低版本ie
{
console.log("***");
console.log("ie版本 "+dom.currentStyle.color);
}
</script>
</body>
</html>