文档的滚动条、标准怪异模式、视口尺寸 以及JS操作CSS样式

滚动条距离

• window.pageXOffset | window.pageYOffset (IE8 集iE8 以下不兼容)

** 下面两组都是IE8 的解决方法 但是由于兼容性混乱 两种方法 俩组方法互斥，有一组方法有值的话另一组则为0 **

** 解决方法将两个值相加就可以解决问题 **

• document.body.scrollLeft | document.body.scrollTop

• document.documentElement.scrollTop | document.documentElement.scrollLeft

滚动条滚动

• window.srcoll(x,y) | window.scrollTo(x,y) 用法相同 滚动到指定位置

• window.srcollBy(x,y) 会在当前滚动位置相加 可以为负数

标准模式和混杂、怪异模式

• html文档最上面的声明文档 （''）被删除掉就会启动怪异模式；

• 怪异模式下浏览器将会摒弃最新语法，向后兼容

• document.compatMode 两个取值可以判断标准还是怪异模式

  • CSS1Compat 标准模式
  • BackCompat 怪异模式

视口尺寸

• window.innerWinth | window.innerHeight (IE8 及以下iE8 以下不兼容)

** 下面两组针对IE **

• document.documentElement.clientWidth | document.documentElement.clientHeight (标准浏览器都兼容)

• document.body.clientWidth | document.body.clientHeight (适用于怪异模式的浏览器)

CSS 查看以及操作

• dom.style.prop 可读可写；JS唯一可以写入样式的方法（间接改变）；写在行间才会获得此属性；获得值可能会与页面显示的不一样

• getComputedStyle(dom,pseudo);
  只读；获得的是浏览器解决样式冲突后最终显示在页面的属性值；获得值为转换过的绝对值；比如：颜色：为RGB；em : 100px;

  • dom 元素

  • pseudo 伪元素 可以获得伪元素，一般为null

IE不兼容

• IE 方法：dom.currentStyle; 属性 只读； 获得值为原始值；就是写什么出来的就是什么；