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

如何取得中文输入的真实长度？

Jun 24 Javascript

用javascript自动显示最后更新时间

Mar 15 Javascript

jquery分页插件AmSetPager(自写)

Apr 15 Javascript

HTML5使用DeviceOrientation实现摇一摇功能

Jun 05 Javascript

js获取表格的行数和列数的方法

Oct 23 Javascript

jQuery UI Bootstrap是什么?

Jun 17 Javascript

如何解决手机浏览器页面点击不跳转浏览器双击放大网页

Jul 01 Javascript

再谈javascript注入黑客必备！

Sep 14 Javascript

JavaScript输出所选择起始与结束日期的方法

Jul 12 Javascript

javascript实现Java中的Map对象功能的实例详解

Aug 21 Javascript

JS中的算法与数据结构之字典(Dictionary)实例详解

Aug 20 Javascript

js中script的上下放置区别，Dom的增删改创建操作实例分析

Dec 16 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

You might like

PHP 八种基本的数据类型小结

2011/06/01 PHP

PHPMYADMIN导入数据最大为2M的解决方法

2012/04/23 PHP

PHP常见漏洞攻击分析

2016/02/21 PHP

Laravel中的Blade模板引擎示例详解

2017/10/10 PHP

PHP文件操作简单介绍及函数汇总

2020/12/11 PHP

js 设置选中行的样式的实现代码

2010/05/24 Javascript

Jquery.Form 异步提交表单的简单实例

2014/03/03 Javascript

jQuery大于号(>)选择器的作用解释

2015/01/13 Javascript

简单实现bootstrap选项卡效果

2017/02/08 Javascript

vue-router：嵌套路由的使用方法

2017/02/21 Javascript

react-native fetch的具体使用方法

2017/11/01 Javascript

深入理解Vue官方文档梳理之全局API

2017/11/22 Javascript

JS实现网页抢购功能（触发，终止脚本）

2017/11/27 Javascript

详解Vue结合后台的列表增删改案例

2018/08/21 Javascript

js实现动态增加文件域表单功能

2018/10/22 Javascript

微信小程序使用setData修改数组中单个对象的方法分析

2018/12/30 Javascript

Vue组件系列开发之模态框

2019/04/18 Javascript

js实现内置计时器

2019/12/16 Javascript

使用Python编写vim插件的简单示例

2015/04/17 Python

关于Python 3中print函数的换行详解

2017/08/08 Python

Pandas Shift函数的基础入门学习笔记

2018/11/16 Python

python虚拟环境迁移方法

2019/01/03 Python

18个Python脚本可加速你的编码速度(提示和技巧)

2019/10/17 Python

Python实现隐马尔可夫模型的前向后向算法的示例代码

2019/12/31 Python

Python日志logging模块功能与用法详解

2020/04/09 Python

python3 中使用urllib问题以及urllib详解

2020/08/03 Python

Python使用Pygame绘制时钟

2020/11/29 Python

pycharm + django跨域无提示的解决方法

2020/12/06 Python

奥地利婴儿用品和玩具购物网站：baby-markt.at

2020/01/26 全球购物

公司市场部岗位职责

2013/12/02 职场文书

《在家里》教后反思

2014/03/01 职场文书

小摄影师教学反思

2014/04/27 职场文书

2014年医生工作总结

2014/11/21 职场文书

英文自荐信范文

2015/03/25 职场文书

电视新闻稿

2015/07/17 职场文书

MySQL事务操作的四大特性以及并发事务问题

2022/04/12 MySQL