element.style
既可以设置行内样式,也可以读取行内样式。可读可写
Element.style.cssText
用来读写当前元素的所有行内样式。
如果设置cssText值为“”(空字符串),则会清空该元素的所有行内样式。
Element.style.length
返回该元素有多少条行内样式。
Element.style.getPropertyValue()
获取某个属性的属性值
console.log(div.style.getPropertyValue("width")) //200px
//等同于div.style.width
Element.style.setProperty()
设置某个属性的属性值 。可传三个值
第一个值是属性名,第二个是属性值。第三个只能传important,代表优先级最高,可选。
Element.style.removeProperty()
删除某个属性。
Element.style.item()
用来返回指定位置的属性名。
获取非行内样式
element.style只能读写行内样式。并不能读取到非行内样式。
我们可以通过window.getComputedStyle()方法来获取非行内样式。
注意:此方法获取的是层叠之后的样式
window.getComputedStyle()
方法还可以获取伪元素。
注意:加在window对象上
两个冒号代表伪元素, 假的元素
一个冒号代表伪类 代表某种状态
传两个值,第二个值可选,
传一个值代表获取指定元素的某个样式,
传两个值可以获取当前元素的伪元素的某个样式