脚本化css

css脚本化
1.使用style对象
getPropertyValue() 获取指定元素样式的属性值
setProperty() 为指定元素设置样式
用法：e.style.setProperty(propertyname,value,priority)
priority:是否设置！important优先级命令
removeProperty(）：移除指定的CSS属性的样式声明
item()返回style对象中指定索引位置的CSS属性名称。
var name=e.style.item(index)
getAttribute() 获取行内样式字符串信息，也可以获取style的属性值。

2.使用styleSheets对象
    styleSheet为每个样式表定义了一个cssRules对象，用来包含指定样表中的所
有规则。
判断浏览器是否兼容cssRulesa对象：如果支持使用cssRules(非IE浏览器)，不支持
（IE浏览器）
var  cssRules=document.styleSheets[0].cssRules||document.styleSheets[0].rules;
读盒子的样式：
var box=document.getElementById("box");
var  cssRules=document.styleSheets[0].cssRules||document.styleSheets[0].rules;
box.innerHTML="边框："+cssRules[0].styleborder;

3.添加样式：addRule()
styleSheet.addRule(selector,style,[index])

4.位移和位置
1.offsetLeft和offsetTop:描述了元素的偏移位置。
2.offsetParent：定位父级元素。
设置元素的偏移位置：可直接使用CSS属性进行设置。（left和right)
注意：只有定位元素才允许设置元素的位置
3.获取鼠标指针的页面位置：pageX和pageY(兼容Safari)
  clientX和clientY(兼容IE)
4.获取窗口滚动条的位置：scrollLeft和scrollTop
5.设置滚动条的位置：scrollTo(x,y)

5.控制大小
    1.通过访问css样式读取width和heigth
    2.使用offsetWidth和offsetHeight来获取元素的尺寸。
    3.确定滚动条的位置：scrollLeft和scrollTop.
    4.浏览器的尺寸：clientWidth和clientHeight