您的位置：首页 > Web前端 > CSS

用currentStyle和getCompusedStyle获取元素的样式

2015-12-27 14:20 706 查看
昨天尝试了一下calc()方法，用来动态设定元素的宽度，字体大小属性，那计算后的属性值到底是多少呢？

首先说一下：style只能获取元素的内联样式，内部样式和外部样式使用style是获取不到的。内联样式就是只直接写在元素标签内的样式，比如< div style=”width:200px”>。

要想获取内部和外部样式就要是用currentStyle和getCompusedStyle()了。

currentStyle是在IE下运行的,getCompusedStyle()在其它浏览器下运行。

兼容性可参考： http://caniuse.com/

demo如下：

[code]<html>
<head>
    <style type="text/css">
        #div {
            font-size: calc(2em + 5px);
            width: 200px;
        }
    </style>
</head>
<body>

<div id="div">div节点</div>

<script>
    var div = document.getElementById("div");
    var style= div.currentStyle ?
            div.currentStyle : window.getComputedStyle(div, null);
    alert(style.fontSize);
</script>
</body>
</html>


运行效果如下：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航