首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

Document.body.scrollTop的值总为零的快速解决办法

Posted in Javascript onJune 09, 2016

有一个功能需要判断返回顶部按钮是否显示。

JS代码如下：

var sTop = document.body.scrollTop;
  if(sTop>100){
    document.getElementById("sm_top").style.display="block";
  }else{
    document.getElementById("sm_top").style.display="none";
  }

但是发现document.body.scrollTop一直是0。

查资料发现是DTD的问题。

页面指定了DTD，即指定了DOCTYPE时，使用document.documentElement。

页面没有DTD，即没指定DOCTYPE时，使用document.body。

IE和Firefox都是如此。

而我的页面加了<!DOCTYPE html>，所以如下即可。

/*判断回到顶部按钮显示与否*/
   window.onscroll=function(){
    var sTop = document.documentElement.scrollTop;
  if(sTop>100){
    document.getElementById("sm_top").style.display="block";
  }else{
    document.getElementById("sm_top").style.display="none";
  }
  }

以上所述是小编给大家介绍的Document.body.scrollTop的值总为零的解决办法，希望对大家有所帮助！

Document.body.scrollTop的值总为零的快速解决办法

- Author -

starof

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
解析JavaScript中delete操作符不能删除的对象
Dec 03 Javascript
jQuery实现仿路边灯箱广告图片轮播效果
Apr 15 Javascript
浅谈JavaScript字符串与数组
Jun 03 Javascript
基于Jquery实现表单验证
Jul 20 Javascript
JavaScript 常见安全漏洞和自动化检测技术
Aug 21 Javascript
js为什么不能正确处理小数运算？
Dec 29 Javascript
js日期相关函数dateAdd,dateDiff,dateFormat等介绍
Sep 24 Javascript
JS中的Replace()传入函数时的用法详解
Sep 11 Javascript
JavaScript强制类型转换和隐式类型转换操作示例
May 01 Javascript
JavaScript面向对象编程小游戏---贪吃蛇代码实例
May 15 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
Sep 07 Javascript
js获取图片的base64编码并压缩
Dec 05 Javascript
JavaScript事件学习小结（三）js事件对象
Jun 09 #Javascript
javaScript事件学习小结（四）event的公共成员（属性和方法）
Jun 09 #Javascript
JavaScript事件学习小结（一）事件流
Jun 09 #Javascript
JavaScript事件学习小结(五）js中事件类型之鼠标事件
Jun 09 #Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
Jun 09 #Javascript
JS实现星星评分功能实例代码(两种方法)
Jun 09 #Javascript
Node.js中npm常用命令大全
Jun 09 #Javascript
innoDB(3) 间隙锁(2) .NET Framework(2) MVCC(4) GZIP(2) 事务并发(1) 幻读(5) 复读(1) IIS7(1) DBLink(1)
You might like
?繁体转换的class
2006/10/09 PHP
一道关于php变量引用的面试题
2010/08/08 PHP
PHP可变函数的使用详解
2013/06/14 PHP
PHP中mb_convert_encoding与iconv函数的深入解析
2013/06/21 PHP
zend framework中使用memcache的方法
2016/03/04 PHP
Laravel 5.5 异常处理 &amp; 错误日志的解决
2019/10/17 PHP
php对mongodb的扩展(小试牛刀)
2012/11/11 Javascript
详解JavaScript中基于原型prototype的继承特性
2016/05/05 Javascript
vue cli使用绝对路径引用图片问题的解决
2017/12/06 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
2019/03/16 Javascript
JavaScript显式数据类型转换详解
2019/03/18 Javascript
jQuery事件绑定和解绑、事件冒泡与阻止事件冒泡及弹出应用示例
2019/05/13 jQuery
vue + typescript + 极验登录验证的实现方法
2019/06/27 Javascript
微信小程序后端(java)开发流程的详细步骤
2019/11/13 Javascript
Vue的transition-group与Virtual Dom Diff算法的使用
2019/12/09 Javascript
vue keep-alive的简单总结
2021/01/25 Vue.js
对python3 Serial 串口助手的接收读取数据方法详解
2019/06/12 Python
查看Python依赖包及其版本号信息的方法
2019/08/13 Python
关于pymysql模块的使用以及代码详解
2019/09/01 Python
pycharm 更改创建文件默认路径的操作
2020/02/15 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
荷兰在线体育用品商店：Avantisport.nl
2018/07/04 全球购物
Crucial英睿达法国官网：内存条及SSD固态硬盘升级
2018/07/13 全球购物
荷兰音乐会和音乐剧门票订购网站：Topticketshop
2019/08/27 全球购物
日本动漫周边服饰销售网站：Atsuko
2019/12/16 全球购物
以思科路由器为例你写下单臂路由的配置命令
2013/08/03 面试题
年度考核自我鉴定
2013/11/09 职场文书
化学专业毕业生自荐信
2013/11/15 职场文书
小学雷锋月活动总结
2014/07/03 职场文书
个人整改措施落实情况汇报
2014/10/29 职场文书
2014年幼儿园工作总结
2014/11/10 职场文书
河童之夏观后感
2015/06/11 职场文书
职位证明模板
2015/06/23 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书
使用python如何删除同一文件夹下相似的图片
2021/05/07 Python
tomcat下部署jenkins的方法
2022/05/06 Servers