http://www.jb51.net/article/21168.htm

页面具有 DTD(或者说指定了 DOCTYPE)时,使用 document.documentElement。
 
 
做页面的时候可能会用到位置固定的层,读取 document.body.scrollTop 来设置层的位置,像这样:­

window.onscroll = function (){ 
var oFix = document.getElementById("divfix"); 
oFix.style.top = document.body.scrollTop + "px"; 
}

可是怎么没有达到预期效果呢,输出 document.body.scrollTop 的值一看,一直都是 0。原来是 DTD 的问题,要是页面直接用 开头的话就没有问题了。但是要符合 web 标准,DTD 当然是不能少的。具有 DTD 时用 document.documentElement.scrollTop 代替 document.body.scrollTop 就可以了。­

window.onscroll = function (){ 
var oFix = document.getElementById("divfix"); 
oFix.style.top = document.documentElement.scrollTop + "px"; 
}

编者注:­

页面具有 DTD(或者说指定了 DOCTYPE)时,使用 document.documentElement。 
页面不具有 DTD(或者说没有指定了 DOCTYPE)时,使用 document.body。 
在 IE 和 Firefox 中均是如此。 
为了兼容,可以使用如下代码: var scrollTop = window.pageYOffset 
|| document.documentElement.scrollTop 
|| document.body.scrollTop 
|| 0;

document.body.scrollTop 值总为0的更多相关文章

  1. document.body.scrollTop值为0的解决方法[转]

    做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样,       window.onscroll=function () {          ...

  2. 火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取document.body.scrollTop来设置层的位置,像这样, window.on ...

  3. document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    转自http://wo13145219.iteye.com/blog/2001598 一.先遇到document.body.scrollTop值为0的问题 做页面的时候可能会用到位置固定的层,读取do ...

  4. 关于document.body.scrollTop与documentElement.scrollTop

    遇到document.body.scrollTop值为0的问题 今天在写一个小demo的时候,使用滚动条,我用document.body.scrollTop获取滚动条的位置,但是很奇怪的发现在谷歌上获 ...

  5. 将h5用HBuilderX打包成安卓app后,document.documentElement.scrollTop的值始终为0或者document.body.scrollTop始终为0

    let time = setInterval(() => { let scroll = document.documentElement.scrollTop || document.body.s ...

  6. [BUG]document.body.scrollTop=0不生效(回到顶部)

    描述 让body回滚到最顶部,设置 document.body.scrollTop = 0; . 微信内,安卓设备可以,ios设备不可以.   原因 MDN中 scrollTop是这样定义的 一个元素 ...

  7. 关于js中 document.body.scrollTop 不能返回正确值的原因

    本来是为了通过document.body.scrollTop来获取浏览器垂直滚动条向下滚动的像素,但是不管滚动条在什么位置总是返回是0,造成这样的原因和html的头部声明有关,如果头部声明 为:< ...

  8. scrollTop 值为 0

    由scrollTop兼容问题引起: 在 Firefox 和 IE 中,使用 document.documentElement.scrollTop 获取: 在 Chrome 中,使用 document. ...

  9. document.body.scrollTop与document.documentElement.scrollTop兼容

    这两天在写一个JS的网页右键菜单,在实现菜单定位的时候发现了这个问题:chrome居然不认识document.documentElement.scrollTop! 看前辈们的文章,纷纷表示如果有文档声 ...

随机推荐

  1. 修改Form ->Top和Left 造成的莫名其妙的显示异常 “轴信息”

    相关代码: 运行程序: 要等待很久,或者把主窗体最小化,再最大化打开"轴信息" 才会恢复正常. 这个"不爽"很蛋蛋 ,网友亲亲们,有独到见解的亲亲们,期待得到你 ...

  2. Sequence query 好题啊

    Sequence query Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) Subm ...

  3. 前端基础之初识 HTML

    HTML HTML(Hypertext Markup Language)即超文本标记语言,是WWW的描述语言.设计HTML语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便 ...

  4. Bootstrap table 元素列内容超长自动折行显示方法?

    共需要四步: 1.在table元素的父容器div加上:class="table-responsive" 3.设置表头th的width:<th width="20%& ...

  5. 从头编写 asp.net core 2.0 web api 基础框架 (4) EF配置

    第1部分:http://www.cnblogs.com/cgzl/p/7637250.html 第2部分:http://www.cnblogs.com/cgzl/p/7640077.html 第3部分 ...

  6. javascript-OOP基础详解

      前  言 S     N 今天给大家详解一下面向对象编程(简称OOP)基础,OOP 语言使我们有能力定义自己的对象和变量类型 .对象拥有属性和方法 . 所以今天就给大家详解对象和类 . 1-1简介 ...

  7. 学习笔记之08试用div做网页(滨院)-小作业

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. angular添加,查找与全部删除

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  9. d3力导向图聚焦

    效果描述 双击节点,节点以及节点一度关联的节点保持高亮状态,其余节点变灰,半径变小,文字消失,并且向内收缩. 效果展示 正常状态 聚焦效果 关键代码 节点变化 激活节点保持高亮的样式,其余节点应用no ...

  10. Thinking in React Implemented by Reagent

    前言  本文是学习Thinking in React这一章后的记录,并且用Reagent实现其中的示例. 概要 构造恰当的数据结构 从静态非交互版本开始 追加交互代码 一.构造恰当的数据结构 Sinc ...