在IE、FF、Chrome下scrollTop（或scrollLeft）的区别
2010-10-25 10:58
381 查看
在JavaScript中我们可以用document.body.scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离，如果你的页面使用了DTD标识，也就是html源代码中有：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这样的代码的话则应该使用document.documentElement.scrollLeft，在IE和FireFox都是没有问题。
但是我测试Google的Chrome则发现在有DTD标识的页面中document.documentElement.scrollLeft一直为0，反到用document.body.scrollLeft可以获取正确的值.
所以……别纠结了，做个判断如果是Chrome下就乖乖的用body吧。
附注：
scrollLeft：设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop：设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 clientWidth：设置或获取网页可见区域宽 clientHeight：设置或获取网页可见区域高
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这样的代码的话则应该使用document.documentElement.scrollLeft，在IE和FireFox都是没有问题。
但是我测试Google的Chrome则发现在有DTD标识的页面中document.documentElement.scrollLeft一直为0，反到用document.body.scrollLeft可以获取正确的值.
所以……别纠结了，做个判断如果是Chrome下就乖乖的用body吧。
附注：
scrollLeft：设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop：设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 clientWidth：设置或获取网页可见区域宽 clientHeight：设置或获取网页可见区域高
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 在IE、FF、Chrome下scrollTop（或scrollLeft）的区别
- IE、FF、Safari 等浏览器下scrollTop的差异
- javascript：FF/Chrome 与 IE 动态加载元素的区别
- padding-top在IE，FF上的区别及矫正
- scroll事件在IE,chrome，FF中的行为表现
- javascript:FF/Chrome与IE动态加载元素的区别说明
- 【转】ie/ff/chrome下的document.body和document.documentElement的区别以及滚动条滚动到底
- javascript:FF/Chrome与IE动态加载元素的区别说明
- 不但要返回顶部，还要返回底部，小改变，实用，?scroll?的js代码，支持IE，FF，chrome[摘自布布分享,tech.bubufx.com]
- ie和FF 在insertRow和insertCell的区别
- 方法转换IE、Firefox、Chrome区别
- 跨域iframe高度自适应（兼容IE/FF/OP/Chrome）
- FLASH遮挡DIV解决方案，兼容IE FF Chrome
- CSS hack 完全手册 ( IE5.5 IE6 IE7 FF Opera Safari Chrome )
- 图示offsetWidth、clientWidth、scrollWidth、scrollTop、scrollLeft等属性
- 函数的定义在FF与IE，Chrome上的不同表现
- scrollTop、scrollLeft、scrollWidth、scrollHeight原理使用介绍
- js drawImage 下面代码可在IE响应，在chrome和FF不行，如何修改
- JS事件在IE与FF中的区别详细解析
- js 对联广告、漂浮广告封装类（IE,FF,Opera,Safari,Chrome