Document.body.scrollTop的值總為零的快速解決辦法
更新時(shí)間：2016年06月09日 12:07:11 作者：starof
這篇文章主要介紹了Document.body.scrollTop的值總為零的解決方法的相關(guān)資料,非常不錯具有參考借鑒價(jià)值，需要的朋友可以參考下
有一個功能需要判斷返回頂部按鈕是否顯示。
JS代碼如下：
var sTop = document.body.scrollTop;
if(sTop>100){
document.getElementById("sm_top").style.display="block";
}else{
document.getElementById("sm_top").style.display="none";
}
但是發(fā)現(xiàn)document.body.scrollTop一直是0。
查資料發(fā)現(xiàn)是DTD的問題。
頁面指定了DTD，即指定了DOCTYPE時(shí)，使用document.documentElement。
頁面沒有DTD，即沒指定DOCTYPE時(shí)，使用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的值總為零的解決辦法，希望對大家有所幫助！
相關(guān)文章
js實(shí)現(xiàn)的訂閱發(fā)布者模式簡單示例
這篇文章主要介紹了js實(shí)現(xiàn)的訂閱發(fā)布者模式,結(jié)合完整示例形式分析了js訂閱發(fā)布者模式相關(guān)實(shí)現(xiàn)與使用方法,需要的朋友可以參考下2020-03-03
MSAgent 詳細(xì)解說...2006-11-11
本篇文章主要介紹了原生js實(shí)現(xiàn)offset方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
使用json-server簡單完成CRUD模擬后臺數(shù)據(jù)的方法
這篇文章主要介紹了使用json-server簡單完成CRUD模擬后臺數(shù)據(jù)的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
這篇文章主要介紹了ES6函數(shù)和數(shù)組用法,結(jié)合實(shí)例形式分析了ES6函數(shù)和數(shù)組基本功能、原理、用法與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
這篇文章主要介紹了JavaScript中this的用法,結(jié)合實(shí)例形式分析了this的功能、常見用法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-12-12
js對象實(shí)例詳解(JavaScript對象深度剖析,深度理解js對象)
下面小編就為大家?guī)硪黄猨s對象實(shí)例詳解(JavaScript對象深度剖析,深度理解js對象)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
uniapp實(shí)現(xiàn)全局設(shè)置字體大小(小中大的字體切換)
隨著UniApp的流行,越來越多的開發(fā)者選擇使用它來構(gòu)建跨平臺應(yīng)用程序,下面這篇文章主要給大家介紹了關(guān)于uniapp實(shí)現(xiàn)全局設(shè)置字體大小(小中大的字體切換)的相關(guān)資料,需要的朋友可以參考下2023-06-06
這篇文章主要介紹了tweenjs緩動算法的使用,結(jié)合實(shí)例形式分析了Tween.js插件的原理與使用技巧,需要的朋友可以參考下2019-08-08
這篇文章主要介紹了淺談 JS 對象添加 getter與 setter 的5種方法以及如何讓對象屬性不可配置或枚舉,需要的朋友可以參考下2018-06-06