通过DOM来获取元素样式

一、IE浏览器获取样式

读取box1当前显示的样式的宽度
      语法：元素.currentStyle.样式名
      他可以用来显示当前元素样式
      只有IE支持这种方式!!!!

二、其他浏览器获取样式

在其他浏览器中可以使用
    getComputedStyle().样式 
    这个方法来获取当前元素的样式
    这个方法时window的方法 可以直接使用
需要两个参数
    第一个 要获取样式的元素
    第二个 可以传递一个伪元素 一般都传null
该方法会返回一个对象，对象中封装了当前元素的对应样式
可以通过 对象.样式名 来读取样式
比如获取的样式没有设置，则会获取到真实的值，而不是默认值
如果没有设置width 则它不会获取到auto 而是一个长度

IE8不支持此方法

通过currentStyle和getComputedStyle()读取到的样式都是只读的
    不能修改 如果要修改必须通过style属性

三、其他样式操作属性

clientWidth
clientHeight
     这两个属性可以获取元素的可见宽度和高度
         包括内容区和内边距
     这些属性都是不带px的 返回的都是数字 可以直接进行计算
     这些属性都是只读的不能修改
offsetWidth
offsetHeight
    获取元素整个的宽度和高度
        包括内容区和内边距还有边框


offsetParent
    获取当前元素的定位父元素
    会获取到离当前元素最近的开启定位的祖先元素
        如果所有祖先元素都没有开启定位 则返回body


offsetLeft
    当前元素相对于其定位父元素的水平偏移量
offsetTop
    当前元素相对于其定位父元素的垂直偏移量

scrollHeight
scrollWidth
    获取元素整个滚动区域的高度
scrollLeft
scrollTop
    获取水平/垂直滚动条滚动的距离

小技巧：

	  当满足 scrollHeight-scrollTop == clientHeight
	      说明垂直滚动条滚动到底
	  当满足 scrollWidth-scrollLeft == clientWidth
	      说明垂直滚动条滚动到底