博统计后的元素样式,IE有currentStyle,而业内浏览器用getComputedStyle。IE9后呢扶助getComputedStyle了。发现从前写的css方法不佳用了,在chrome中归的结果和外浏览器不同。重现如下

<!DOCTYPE HTML>
<HTML>
 <HEAD>
    <meta charset="utf-8" />
    <title>css opacity</title>
    <style type="text/css">
        div {
            background: gold;
            margin: 10px;
        }

        #d2 {
            opacity: 0.2;
            width : 250px;
        }
    </style>
 </HEAD>

 <BODY>
<div id="d1" style="opacity:0.1;width:200px;">d1</div>
<div id="d2">d2</div>

<button onclick="test()">getOpacity</button>

<script type="text/javascript">
    var d1 = document.getElementById('d1');
    var d2 = document.getElementById('d2');

    function test() {
        var sty1 = window.getComputedStyle(d1, null),
        sty2 = window.getComputedStyle(d2, null);

        alert(sty1.opacity);
        alert(sty2.opacity);
    }
</script>
 </BODY>
</HTML>

些微独div:d1和d2。样式分别写于  style属性和css
 中,透明度分别是0.1,0.2。都通过  getComputedStyle
模式赢得opacity。点击按钮,Chrome中如下

图片 1

图片 2

设若  IE9/Firefox/Safari/Opera
弹出的分别是0.1,0.2。Chrome再次来到的字符串长度是19,此外浏览器仍旧3。

jQuery的css方法也存这题目。 注意!

相关文章

网站地图xml地图