关于在任何版本的浏览器获取对象的属性的函数(轮子)
我之前学到的getelementbyid和getelementsbytagame
第一个只能得到#id名字的标签当做对象
SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。第二个可以得到标签名字tagname的标签当做对象进行操作
当然还有getatrribute()可以得到自定义的属性
比如 一个对象odiv.zzz=1 这个对象zzz这个属性是自定义的 用打点调用的方法肯定不能试用,所以必须要用odiv.getattribute(“zzz”)用这种方法可以得到1这个value
前两种方法得到的element元素都只能获取行内style属性的样式,而不能获取外联样式表和内联样式表中的样式。接下来DOM提供了一个很好的API就是window.getcomputerStyle
()这个API 可以返回一个样式对象接着用getpropertyValue(“”)可以获取样式表的中的style得到计算机计算后的样式并且返回
写法window.getComputedStyle(oDiv).getPropertyValue("width")——引号内的不为驼峰写法
Get得到 computer 计算 style 样式 property 属性 value值
Window可以省略!并且getpropertyvalue也可以省略
写法为getcomputerstyle(oDiV)[“padding-left”];
以上的写法只有高级浏览器chrome兼容
但是以上的写法在IE678是不兼容的。在IE678的写法如下
如果想得到元素的内联样式或者外联样式表的计算后样式
oDiv.CurrentStyle.width
oDiv.currentstyle.paddingLeft
oDiv.currentstyle[paddingLeft];
这种写法只有在以上版本才使用可以返回computerstyle
注释:但是因为是低级浏览器 所以颜色不会用rgb的方法显示,被文字撑出的高度先不能显示高度而是显示auto
_______________________________________________________________________
考虑到兼容性问题,我首先想到的是<!--[if lte IE 8]>.....<![endif]>用这种方法解决,但是这种写法封装起来很复杂,不如直接造一个轮子,就是一个函数,可以直接把一个对象的一个想要得到的属性得到的一个函数(fetch得到)
Function fetchcomputerstyle(obj,property){
//obj代表一个对象,property代表一个想要得到的属性
If(window.getcomputerstyle){
//这是判断是否是高级浏览器,不要求驼峰写法,所以需要验证是否为-写法
property = property.replace(/([A-Z])/g,function(match,$1){
return “-” + $1.toLowercase()});
return getcomputerstyle(obj)[property];
}else {
//这种情况是低版本浏览器,针对IE678的获取元素
Property = property.replace(/(\-[\w])/g,function(match,$1){
Return $1.toUppercase();})
Return obj.currentstyle[property];
}
上面的fetchcomputerstyle函数就是一个可以在任何浏览器获取外联样式,内联样式得到对象的属性值。
