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的值总为零的解决办法,希望对大家有所帮助!

Javascript 相关文章推荐
JQuery触发radio或checkbox的change事件
Dec 18 Javascript
Extjs407 getValue()和getRawValue()区别介绍
May 21 Javascript
Node.js操作Firebird数据库教程
Mar 04 Javascript
Javascript基础_嵌入图像的简单实现
Jun 14 Javascript
浅谈Node模块系统及其模式
Nov 17 Javascript
react-router v4如何使用history控制路由跳转详解
Jan 09 Javascript
jQuery each和js forEach用法比较
Feb 27 jQuery
JavaScript强制类型转换和隐式类型转换操作示例
May 01 Javascript
使用layui日期控件laydate对开始和结束时间进行联动控制的方法
Sep 06 Javascript
JS数组方法join()用法实例分析
Jan 18 Javascript
js实现数据导出为EXCEL(支持大量数据导出)
Mar 31 Javascript
jquery自定义组件实例详解
Dec 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
You might like
一个程序下载的管理程序(四)
2006/10/09 PHP
php 修改、增加xml结点属性的实现代码
2013/10/22 PHP
PHP 获取 ping 时间的实现方法
2017/09/29 PHP
计算新浪Weibo消息长度(还可以输入119字)
2013/07/02 Javascript
js 日期比较相关天数代码
2014/04/02 Javascript
html的DOM中document对象anchors集合用法实例
2015/01/21 Javascript
使用JQuery在线制作ppt并在线演示源码特效
2015/09/08 Javascript
JavaScript基于原型链的继承
2016/06/22 Javascript
vue注册组件的几种方式总结
2018/03/08 Javascript
通过Nodejs搭建网站简单实现注册登录流程
2019/06/14 NodeJs
Vue中axios的封装(报错、鉴权、跳转、拦截、提示)
2019/08/20 Javascript
微信小程序在text文本实现多种字体样式
2019/11/08 Javascript
[06:25]第二届DOTA2亚洲邀请赛主赛事第二天比赛集锦.mp4
2017/04/03 DOTA
Python去除列表中重复元素的方法
2015/03/20 Python
详解Python核心对象类型字符串
2018/02/11 Python
Python数据结构之哈夫曼树定义与使用方法示例
2018/04/22 Python
纯用NumPy实现神经网络的示例代码
2018/10/24 Python
PyCharm-错误-找不到指定文件python.exe的解决方法
2019/07/01 Python
python 环境搭建 及python-3.4.4的下载和安装过程
2019/07/20 Python
Django 静态文件配置过程详解
2019/07/23 Python
Flask框架单例模式实现方法详解
2019/07/31 Python
python通过SSH登陆linux并操作的实现
2019/10/10 Python
python3爬取torrent种子链接实例
2020/01/16 Python
Python如何实现在字符串里嵌入双引号或者单引号
2020/03/02 Python
如何理解Python中的变量
2020/06/01 Python
Python在centos7.6上安装python3.9的详细教程(默认python版本为2.7.5)
2020/10/15 Python
让IE支持HTML5的方法
2012/12/11 HTML / CSS
几个常见的消息中间件(MOM)
2014/01/08 面试题
通信工程专业个人找工作求职信范文
2013/09/21 职场文书
新入职员工的自我介绍演讲稿
2014/01/02 职场文书
办公室秘书自我鉴定
2014/01/18 职场文书
诉讼财产保全担保书
2014/05/20 职场文书
应届硕士毕业生自荐信
2014/05/26 职场文书
悬崖上的金鱼姬观后感
2015/06/15 职场文书
2015大学生暑假调查报告
2015/07/13 职场文书
delete in子查询不走索引问题分析
2022/07/07 MySQL