您的位置:首页 > Web前端 > CSS

js中style,currentStyle和getComputedStyle的区别以及获取css操作方法

2018-03-09 14:45 585 查看
在js中,之前我们获取属性大多用的都是ele.style.attr这种形式的方法,但是这种方法是有局限性的,该方法只能获取到行内样式,获取不了外部的样式.所以呢下面我就教大家获取外部样式的方法,因为获取外部的样式存在兼容性的问题,所以先看代码function css(obj, attr) {
if (obj.currentStyle) {
return obj.currentStyle[attr];//只兼容IE
} else {
return getComputedStyle(obj, false)[attr];//不兼容IE,但兼容其他浏览器
}
}看完代码,有不懂的继续往下看style:各大浏览器都兼容,能设置样式和获取样式,但是获取不了外部样式,如果写了行内没有的样式,返回的是空值写法:ele.style.attr(这样为获取),ele.style.attr="值"(这是赋值);currentStyle属性和getComputedStyle属性不能设置属性,只能获取currentStyle:该属性只兼容IE,不兼容火狐和谷歌currentStyle指全局样式表、内嵌样式和 HTML 标签属性中指定的对象格式和样式的所有样式,例如以下行间和非行间样式都为currentStyle范围:
 写法:ele.currentStyle["attr"]或者ele.currentStyle.attr;getComputedStyle:该属性是兼容火狐谷歌,不兼容IE语法:arr_style=window.getComputedStyle(elem_id,ov) 
其中ov:伪元素,是否要获取伪元素属性值。如hover,active,link等属性。如果不想获取这些伪元素的属性值请填写为null。返回值类型和style一样。
写法:window.getComputedStyle(ele,null)[attr]或者是window.getComputedStyle(ele,null).attr
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息