编程 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 相关文章推荐

js中escape对应的C#解码函数 UrlDecode

Dec 16 Javascript

使用JS取得焦点(focus)元素代码

Mar 22 Javascript

jQuery文件上传插件Uploadify使用指南

Jun 05 Javascript

JQuery 实现在同一页面锚点链接之间的平滑滚动

Oct 29 Javascript

javascript中clipboardData对象用法详解

May 13 Javascript

js中 javascript:void(0) 用法详解

Aug 11 Javascript

js省市联动效果完整实例代码

Dec 09 Javascript

移动端使用localStorage缓存Js和css文的方法(web开发)

Sep 20 Javascript

vue工程全局设置ajax的等待动效的方法

Feb 22 Javascript

跟混乱的页面弹窗说再见

Apr 11 Javascript

利用Angular7开发一个Radio组件的全过程

Jul 11 Javascript

Javascript和jquery在selenium的使用过程

Oct 31 jQuery

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

增删查改(1) #{}(1) 代理(2) flex(1) 外键(1) 克隆(1) SQL注入(2) canvas(2) 图片模糊(1) 选择器(1)

You might like

dedecms系统常用术语汇总

2007/04/03 PHP

PHP递归删除目录几个代码实例

2014/04/21 PHP

PHP获取数组最大值下标的方法

2015/05/12 PHP

使用PHPWord生成word文档的方法详解

2019/06/06 PHP

PHP封装cURL工具类与应用示例

2019/07/01 PHP

根据鼠标的位置动态的控制层的位置

2009/11/24 Javascript

理解Javascript_03_javascript全局观

2010/10/11 Javascript

jQuery的初始化与对象构建之浅析

2011/04/12 Javascript

JS、CSS加载中的小问题探讨

2013/11/26 Javascript

iframe实用操作锦集

2014/04/22 Javascript

node.js中的http.request.end方法使用说明

2014/12/10 Javascript

再次谈论Javascript中的this

2016/06/23 Javascript

微信小程序 UI布局常用技巧整理总结

2016/12/05 Javascript

详解基于mpvue的小程序markdown适配解决方案

2018/05/08 Javascript

vue在自定义组件中使用v-model进行数据绑定的方法

2019/03/25 Javascript

jQuery/JS监听input输入框值变化实例

2019/10/17 jQuery

Vuex,iView UI面包屑导航使用扩展详解

2019/11/04 Javascript

Vue+Vant 图片上传加显示的案例

2020/11/03 Javascript

Python下的Mysql模块MySQLdb安装详解

2014/04/09 Python

Python中使用select模块实现非阻塞的IO

2015/02/03 Python

Python实现的弹球小游戏示例

2017/08/01 Python

解决pandas中读取中文名称的csv文件报错的问题

2018/07/04 Python

Flask实现跨域请求的处理方法

2018/09/27 Python

Django接收自定义http header过程详解

2019/08/23 Python

python 中不同包类方法之间的调用详解

2020/03/09 Python

CSS实现圆形放大镜狙击镜效果只有圆圈里的放大

2012/12/10 HTML / CSS

webapp字号大小跟随系统字号大小缩放的示例代码

2018/12/26 HTML / CSS

Python面试题：如何用Python来发送邮件

2016/03/15 面试题

宾馆总经理岗位职责

2014/02/14 职场文书

党章培训心得体会

2014/09/04 职场文书

2014党支部对照检查材料思想汇报

2014/10/05 职场文书

大学生上课迟到检讨书

2014/10/15 职场文书

出纳年终工作总结2014

2014/12/05 职场文书

幼儿园教师读书笔记

2015/06/29 职场文书

导游词之临安白水涧

2019/11/05 职场文书

Django显示可视化图表的实践

2021/05/10 Python