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

JS获取CSS样式的问题

2016-03-11 21:52 435 查看

今晚做一个小小的JS效果时，突然发现用JS获取CSS样式时只能获取到内部的，也就是写在HTML标签里的style，如果把样式写在<head></head>或者是CSS文件里面就获取不了，用alert（)调试一下，就只弹出一个，什么也没有。于是就去网上找了下资料，果然，让我找到解决的办法。解决办法如下：

如果浏览器是IE内核的话用object.currentStyle就行了，即

对象.currentStyle.属性名

如果是FireFox的话就用document.defaultView.getComputedStyle(obj,null)这个比较复杂一点，在下也不是很懂.

当然我们一般都是将这两种结合起来，然后判断是什么浏览器来决定用哪个

网上一些代码是这样的

<script type=”text/javascript”>
function GetCurrentStyle (obj, prop) {
    if (obj.currentStyle) {
        return obj.currentStyle[prop];
    }
    else if (window.getComputedStyle) {
        prop = prop.replace (/([A-Z])/g, “-$1”);
        prop = prop.toLowerCase ();
        return document.defaultView.getComputedStyle (obj,null)[prop];
    }
    return null;
}
var dd=document.getElementById(“qq”);
alert(GetCurrentStyle(dd,”width”));
</script>

然而我却屡试都错，我就慢慢调试，得到自己的版本

function getStyle(obj){

if(obj.currentStyle){
return obj.currentStyle
}
else if(window.getComputedStyle)
return document.defaultView.getComputedStyle(obj,null)
return null;
}

简单了很多，直接不传属性值进来，因为在调试哪里出错的时候，发现正是属性值那有问题，虽然getComputedStyle是以数组的形式返回的，但我发现用网上的代码那样直接获取属性值的时候返回来的居然是undefined，于是就删掉属性值，然后这样写getStyle(obj).属性名获取属性的值就成功了。

这是我这个渣渣第一次注册CSDN博客，也是第一次发博客，纯属纪念一下我在写代码的时候遇到的问题，以后忘记了好查看。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript

相关文章推荐

新的分享

章节导航