JS中如何获取CSS属性

JS中如何获取CSS属性,第1张

objstyle方法,这个方法只能JS只能获取写在html标签中的写在style属性中的值(style=”…”),看下面代码

XML/HTML代码

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 10 Transitional//EN” “>

如果这个数组不是json的话,就可以for(var i=0;i <arraylength;i++{}来获取数组中的每一个对象,然后在{}里添加:

if(typeof array[i] == "object){

for(var key in array[i]){

//这里的array[i][key]就能遍历array数组里的对象的属性值了,key就是属性名,

}

}

如果最初的array也是个对象的话,就把for(var i=0;i <arraylength;i++{}改成for(var i in array){}就行了

是这样的,一开始需要获取某一个元素的 left 值,我就用 elestyleleft 去获取了(基础不扎实还好意思来丢人),然后居然返回的是空。

好吧,追本溯源,问题的根源以及区别就在这里了。

所以,我那样是获取不到某一个元素的一个其他方式设置的样式属性值的,所以我就打算谷歌一下别的方法了。

特点:

- 只可读,但是可以读取所有的样式属性值。但是不能通过该方法去设置样式属性值。

currentStyle 获取的是一个元素的所有的样式属性值,这一点功能是与 getComputedStyle() 一样的,但是在获取某一个具体的属性的时候,可以结合 getAttribute 来实现。

和 getComputedStyle 方法不同的是,currentStyle 要获得属性名的话必须采用驼峰式的写法。也就是如果我需要获取 font-size 属性,那么传入的参数应该是 fontSize。因此在IE 中要获得单个属性的值,就必须将属性名转为驼峰形式。 ( 感谢这篇文章。 )

关于 getComputedStyle 返回的值,具体查看这里。

不管你最初定义的样式是什么,涉及到宽度高度之类的,返回的都是最后实际使用的宽度和高度。

关于 elestyle 的返回值,是和定义的样式的值相等的,如果设置为auto,就直接返回auto。

然后是元素的高宽,对于一个没有设定高宽的元素而言,在 IE678 下使用 getPropertyValue("width|height") 得到的是 auto 。而标准浏览器会直接返回它的 px 值,当然我们希望在 IE 下也返回 px 值。

这里的 HACK 方法是使用 elementgetBoundingClientRect() 方法。

elementgetBoundingClientRect() -- 可以获得元素四个点相对于文档视图左上角的值 top、left、bottom、right ,通过计算就可以容易地获得准确的元素大小。

参考链接 chokcoco的博客园

以上就是关于JS中如何获取CSS属性全部的内容,包括:JS中如何获取CSS属性、js获取input属性、怎么获取js 数组中的对象的属性等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9672443.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-30
下一篇 2023-04-30

发表评论

登录后才能评论

评论列表(0条)

保存