获取 修改 CSS 样式
内联(style里的)样式
element.style.color
element.style.getPropertyValue("color")
非内联样式
window.getComputedStyle(elem1,null).getPropertyValue("backgroundColor"); (getComputedStyle(elem1,null) 第二个参数null用于获取伪类样式(":after"))
document.defaultView.getComputedStyle(elem1,null).getPropertyValue("backgroundColor");
(使用defaultView可能一是人们不太乐意在window上专门写个东西,二是让API在Java中也可用)
ie(6-8)下需要使用元素方法实现:
object.currentStyle.backgroundColor ( IE不支持DOM的style对象下的方法 ,例如element.style.removeProperty("color") )
computed style都是只读的
下面这种可以获取<style>标签里面的样式
document.styleSheets[0].cssRules || document.styleSheets[0].rules
添加多条样式到style属性:
element.style.cssText = element.style.cssText + ";" + addcss(需要添加的样式);
(语法 element.style.cssText="width:200px;height:70px;display:bolck"; )
淘宝:
var styleEl = document.createElement("style");
document.getElementsByTagName("head")[0].appendChild(styleEl);
if (styleEl.styleSheet) {
if (!styleEl.styleSheet.disabled) { //判断样式是否添加到document
styleEl.styleSheet.cssText = cssText;
}
} else {
try {
styleEl.innerHTML = cssText
} catch(e) {
styleEl.innerText = cssText;
}
}