众所周知,CSS样式有三种:内嵌样式、内部样式和外部样式。JavaScript获取CSS样式时,有两种情况:内嵌样式获取方式和非内嵌样式获取方式。
1.获取内联样式相对简单,可以通过element . style . attr(element . style . attribute)获取。示例:
!doctype html lang=' en ' head meta charset=' utf-8 ' title JavaScript获取CSS样式/标题/头体!-为p标记设置内联样式,并添加一个click事件-p style=' width : 200px;高度: 100像素;background : pink ' onclick=' show()' blog park-开发者在线主页/p脚本类型=' text/JavaScript '函数show(){ varobj=document . getelementsbyname(' p ')[0];alert(obj . style . width);}/脚本/正文/html运行:
可以通过element.style.attr获取内联样式的属性值,也可以用obj.style.width=300 'px '的形式设置属性值。
第二,非直插式风格获取方式因浏览器不同可分为两种,即基于IE浏览器的和非基于IE浏览器的方式如Google Firefox。
1.基于IE浏览器的非内联采集方法:通过element.currentStyle['attr']
工业工程运行结果:
2.基于非IE的非在线获取方法,如火狐Google:通过getComputedStyle(element.null/伪类)[attr]
Firefox操作结果:
两者之间的兼容性:
总结:以上就是用JavaScript获取CSS样式的方法,其中获取兼容非内嵌样式和非IE的IE可以通过封装一个函数,多次调用来实现。
记住:不是内联样式获取方式,只能获取不能设置。
摘要
以上是关于如何通过边肖介绍的JavaScript(兼容所有浏览器)获得CSS样式的老生常谈。希望对大家有帮助。如果你有任何问题,请给我留言,边肖会及时回复你。非常感谢您对我们网站的支持!