js获取style属性的几种方法

最新推荐文章于 2025-03-27 20:58:18 发布

能跑的代码就是好码

最新推荐文章于 2025-03-27 20:58:18 发布

阅读量5.7k

点赞数

分类专栏： JS小技巧文章标签： javascript firefox 前端

本文链接：https://blog.csdn.net/weixin_38428663/article/details/122051749

版权

JS小技巧专栏收录该内容

2 篇文章

订阅专栏

本文介绍了JavaScript获取元素样式属性时遇到的问题及解决方案。通常，通过`document.getElementById(id).style.XXX`只能获取内联样式，但在Firefox和Chrome中，需要使用不同的方法。对于IE，可以使用`currentStyle`，而在Firefox和Chrome等其他浏览器中，需使用`window.getComputedStyle(element, null).getPropertyValue('XXX')`来获取样式值。" 117015314,10593431,抖音本地生活服务：从种草到消费的闭环,"['人工智能', '大数据', '数据分析', '数据库', '本地生活服务']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一个超简单的小需求，用JS获得style的背景颜色，但是值一直为空，这个原因要记下来。（转）
js只能修改html内部的css样式代码。
　　在JavaScript中，通过document.getElementById(id).style.XXX可以获取到XXX的值，但意外的是这样做只能取到通过内嵌方式设置的样式值，即style属性里面设置的值。

原来是我把样式写到了head中。但是一般不把样式写成行内样式的，所以得找到解决的办法。随继续寻找之。功夫不负有心人，终于找到了解决方法：
　　如果是ie，问题很好解决，只要把style改成currentStyle即可。即：

function $(id){
 return documentElementById(id);
}
var qL = $("qqChat").currentStyle.left;
alert(qL);//结果有值

而在firefox和chorm下，则采用另外一种方式：

function $(id){
 return documentElementById(id);
}
var qL = document.defaultView.getComputedStyle($("qqChat"),null)
var qLL = qL.left;
alert(qLL);//结果有值

解决