欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js获取、设置元素css属性值

程序员文章站 2024-03-17 11:15:46
...

这里以获取html元素宽高为例

js获取html元素宽高有两种方法:1.obj.style.width;2.getComputedStyle和currentStyle(IE)函数

但实际操作上会发现,第一种方法是无法获取到行内设置的元素属性值的,使用obj.offsetWidth即可,样式可以anywhere(合理的)。(使用obj.offsetWidth;获取到的是容器当前大小,包括边(border)和内填充(padding)的值,不包括margin)。
使用getComputedStyle和currentStyle(IE)函数来获取样式属性,可封装如下的函数:

function getStyle(obj,attr){
  if(obj.currentStyle){//ie
    return obj.currentStyle[attr];
  }else{
    return getComputedStyle(obj)[attr];
  }
}
直接调用这个函数就可以了。

getComputedStyle方法具有可选的第二个参数,针对于伪元素,可参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/getComputedStyle