添加xhtml声明后documentElement.scrollTop为0

  再chrome浏览器下面,无论申明doctype为html或者xhtml,获取或者设置页面的滚动高只能使用document.body.scrollTop,使用document.documentElement.scrollTop得到的是0,chrome版本为16.0.912.75 m,而其他浏览器则按照doctype的不同使用不同的对象,申明为xhtml时使用document.documentElement.scrollTop,doctype为html时则使用document.body.scrollTop。

添加xhtml声明后documentElement.scrollTop为0

测试代码如下

XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<body style="height:1000px">
<script type="text/javascript">
window.onload=function(){
  var body=document.body,documentElement=document.documentElement
  documentElement.scrollTop=body.scrollTop=100;//设置滚动高度,chrome浏览器设置document.body成功,document.documentElement设置失败,参考下面的输出
  alert('compatMode:'+document.compatMode+'\n'+//CSS1Compat
        'document.documentElement.scrollTop:'+documentElement.scrollTop+'\n'+//chrome浏览器输出0,其他浏览器如firefox,IE输出100
        'document.body.scrollTop:'+body.scrollTop);//chrome输出100,其他浏览器如firefox,IE输出0
}
</script>
</body>

HTML

<body style="height:1000px">
<script type="text/javascript">
window.onload=function(){
  var body=document.body,documentElement=document.documentElement
  documentElement.scrollTop=body.scrollTop=100;//设置滚动高度,chrome浏览器设置document.body成功,document.documentElement设置失败,参考下面的输出
  alert('compatMode:'+document.compatMode+'\n'+//BackCompat
        'document.documentElement.scrollTop:'+documentElement.scrollTop+'\n'+//chrome浏览器输出0
        'document.body.scrollTop:'+body.scrollTop);//chrome输出100
}
</script>
</body>

 

加支付宝好友偷能量挖...


原创文章,转载请注明出处:添加xhtml声明后documentElement.scrollTop为0

评论(0)Web开发网
阅读(183)喜欢(0)JavaScript/Ajax开发技巧