1.鼠标坐标位置clientX clientY 客户区坐标(视口) pageX pageY 页面坐标 screenX screenY 屏幕坐标 2.元素大小偏移量 offset-offsetWidth offsetHeight 带边框元素大小 offsetLeft offsetTop 外边框到带定位的父级元素(或body)内边框的像素 客户区大小 client-clientWidth clientHeight 不带边框元素大小 clientLeft clientTop 左 上边框宽度 滚动大小 scroll-scrollWidth scrollHeight 没有滚动条时,元素内容的实际大小 scrollLeft scrollTop 视口外(左 上)的元素内容像素,设置可改变滚动位置 |
区别: offset只读 可得到任意样式表的样式值 得到的的值是number,没有单位 offsetWidth包含padding+border+content style可读写 只能得到行内样式表的样式值 得到的值是string,带单位 style.width不包含padding和border,仅content 总结: offset-获取元素大小位置 style修改值 记得加上px |
区别: offsetWidth包含padding+border+content clientWidth不包含border,仅padding+content |
|
区别:当内容超出视口时 clientWidth返回视口中元素大小 scrollWidth返回内容的实际大小 都不包含border |
|
window.pageXOffset element.scrollLeft window.pageYOffset element.scrollTop |