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

在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