当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 用javascript getComputedStyle获取和设置style的原理

Javascript
JavaScript中全局变量、函数内变量以及常量表达式的效率测试
写出更好的JavaScript之undefined篇(上)
Javascript 刷新全集常用代码
传智播客学习之java 反射
javascript DOM编程实例(智播客学习)
javascript 在网页中的运用(asp.net)
通过身份证号得到出生日期和性别的js代码
写出更好的JavaScript程序之undefined篇(中)
js获取图片长和宽度的代码
js cookies实现简单统计访问次数
根据鼠标的位置动态的控制层的位置
dropdownlist之间的互相联动实现(显示与隐藏)
javascript select控件间内容互相移动
asp.net下利用js实现返回上一页的实现方法小集
JavaScript 利用StringBuffer类提升+=拼接字符串效率
JS 实现双色表格实现代码
利用JavaScript更改input中radio和checkbox样式
jquery.ui.draggable中文文档
js loading加载效果实现代码
JS 倒计时实现代码(时、分,秒)

Javascript 中的 用javascript getComputedStyle获取和设置style的原理


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 242 ::
收藏到网摘: n/a

这两天用了baidu 百度空间中的弹出窗口js,感觉不错,很强大,很好很简单的解决了好几个问题,界面友好度以及美化也好多了,以前都是硬邦邦window.open(); 有兴趣的朋友搜索"百度 popup"就好了,已经有人给出了注释,强大。
最有意思的是用javascript获取和设置style
DOM标准引入了覆盖样式表的概念,当我们用document.getElementById("id").style.backgroundColor 获取样式时 获取的只是id中style属性中设置的背景色,如果id中的style属性中没有设置background-color那么就会返回空,也就是说如果id用class属性引用了一个外部样式表,在这个外部样式表中设置的背景色,那么不好意思document.getElementById("id").style.backgroundColor 这种写法不好使,如果要获取外部样式表中的设置,需要用到window对象的getComputedStyle()方法,代码这样写window.getComputedStyle(id,null).backgroundColor
但是兼容问题又来了,这么写在firefox中好使,但在IE中不好使
两者兼容的方式写成
window.getComputedStyle?window.getComputedStyle(id,null).backgroundColor:id.currentStyle["backgroundColor"];
如果是获取背景色,这种方法在firefox和IE中的返回值还是不一样的,IE中是返回"#ffff99"样子的,而firefox中返回"rgb(238, 44, 34) "
值得注意的是:window.getComputedStyle(id,null)这种方式不能设置样式,只能获取,要设置还得写成类似这样id.style.background="#EE2C21";