转自:http://www.zhangxinxu.com/wordpress/?p=1907
本文中介绍的元素具有很好的兼容性,可直接使用。
一、Window视图属性
这些属性可以hold住整个浏览器窗体大小。微软则将这些API称为“Screenview 接口”。包括:
innerWidth
属性和 innerHeight
属性
pageXOffset
属性和 pageYOffset
属性
screenX
属性和 screenY
属性
outerWidth
属性和 outerHeight
属性
例如
innerWidth
表示获取window窗体的内部宽度,不包括用户界面元素,比如窗框
2.pageXOffset
属性和 pageYOffset
属性
整个页面滚动的像素值。pageXOffset:x方向滚动的像素值,pageYOffset:y方向滚动的像素值
3.screenX
属性和 screenY
属性
浏览器窗口在显示器中的位置,screenX表示水平位置,screenY表示垂直位置。
4.outerWidth
属性和 outerHeight
属性
outerWidth
属性和 outerHeight
表示整个浏览器任务栏的大小,包括任务栏等。
二、元素视图属性
clientLeft
和
clientTop
clientWidth
和
clientHeight
offsetLeft
和
offsetTop
offsetParent
offsetWidth
和
offsetHeight
scrollLeft
和
scrollTop
scrollWidth
和
scrollHeight
1.clientLeft
和clientTop
offsetLeft
和offsetTop
的元素)
clientWidth
和clientHeight
。当你向下滚动滚动条的时候,scrollHeight
应该等用于scrollTop + clientHeight
。三、鼠标位置(Mouse position)
与鼠标事件(例如普通的单击)相关的些属性。这个东西基本上JavaScript一些必修书籍(例如《JavaScript高级程序设计》)上都有介绍。这里我就简单展示下兼容性和一些必要的文字介绍。
相关的些属性有:
clientX,clientY
offsetX, offsetY
pageX, pageY
screenX, screenY
x, y