关于document.body.scrollTop的console值为0的原因

最新推荐文章于 2022-06-15 09:18:10 发布
最新推荐文章于 2022-06-15 09:18:10 发布
阅读量112 收藏
点赞数
分类专栏： js html 前端 文章标签： js scrollTop html 声明
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u013100927/article/details/103215393
版权
前端 同时被 3 个专栏收录
16 篇文章 0 订阅
订阅专栏
js
14 篇文章 0 订阅
订阅专栏
html
1 篇文章 0 订阅
订阅专栏

当html文档中的有<!DOCTYPE html>声明时， document.body.scrollTop值就是总为0 

这时候换成document.documentElement.scrollTop试试看

ie到时可以了 但是谷歌的老点的版本还是行 

后来又查了查 才知道原来ie狐火都是documentElement， 只有谷歌的是body 但是后来谷歌也改了 

所以这么写

 document.body.scrollTop + document.documentElement.scrollTop;
     

 

爽哈哈
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
document.documentElement && document.documentElement.scrollTop
10-30
console.log('当前滚动位置：', scrollTop); }; ``` 总的来说，理解和正确使用`document.documentElement` 和 `document.documentElement.scrollTop` 是构建高性能、跨浏览器的网页应用的关键。在实际开发中，必须...
javascript scrollTop正解使用方法
01-19
在实际应用中经常会遇到以下问题：document.documentElement.scrollTop在Chrome里总为0document.body.scrollTop 在IE和firefox里总为01、各浏览器下 window.pageYOffset/document.documentElement.scrollTop/...
document.body.scrollTop总是0的原因
Bug 无处不在！
02-09 1万+
最近写了一个拖动层的HTML页面,   需要获取滚动条当前的位置.于是我使用document.body.scrolltop获取y方向滚动的位置...奇怪的事情出现了! 无论滚动条怎么滚动, document.body.scrolltop竟然一直都是0!对比以前写的一个页面.发现区别很小. 旧页面却没有问题.这就怪了...我开始一点一点的排除,去掉多于的代码. 直到我去掉文档最顶部的
JS 获取滚动条到底部得距离
qq_45272642的博客
02-12 3609
$(window).scroll(function() { // 变量 scrollHeight 是滚动条的总高度 let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight // 变量 windowHeight 是可视区的高度 let windowHeight = document.documentElement.clientHeight || docume.
滚动条高度
jhl13475236412的博客
07-30 388
js 的兼容语法 let scrollTop = document.documentElement.scrollTop || document.body.scrollTop; jq 直接定义,jq来处理兼容问题 $(window).scrollTop() $(window).scrollLeft() 可以直接设定参数,设定浏览器滚动条的移动位置 如下例所示，简单的回顶部效果 <div class = "backTop" style = "..
vue滚动条若干问题
qq_37493515的博客
11-27 572
一、获取滚动轴 scrolHandle() { // 滚动轴距离顶部位置 let scrollTop = document.documentElement.scrollTop || document.body.scrollTop; // 当前页面 let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
解决scrollTop兼容问题 document.documentElement.scrollTop || document.body.scrollTop
YOUAFR的博客
10-19 1628
在设计页面时可能经常会用到固定层的位置，这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标，这里可能就会用到document.body.scrollTop等属性，但是此属性在xhtml标准网页或者更简单的说是带标签的页面里得到的结果是0，如果不要此标签则一切正常，那么在xhtml页面怎么获得body的坐标呢，当然有办法-使用document.documentElement来取代docum
js获取文本框的值!js获取浏览器高度和宽度值[收集].pdf
10-11
* `document.body.scrollTop`：获取浏览器的被卷去的高度 * `document.body.scrollLeft`：获取浏览器的被卷去的左边距 ### 使用 `window` 对象 * `window.screen.height`：获取浏览器的屏幕高度 * `window.screen....
前端大厂最新面试题-visible.docx
最新发布
06-06
const viewPortHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; const offsetTop = el.offsetTop; const scrollTop = document.documentElement....
JavaScript封装对话框代替系统alert功能.docx
11-26
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop; dialog.style.left = (scrollleft + (w - 20 - width) / 2) + 'px'; dialog.style.top = (scrollTop + (h - 20 - height) / ...
解决VUE中document.body.scrollTop为0的问题
10-18
今天小编就为大家分享一篇解决VUE中document.body.scrollTop为0的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
js：alert、console、document、promp的使用
weixin_63489869的博客
06-15 606
js：alert、console、document的使用
js scrollTop兼容性问题--document.body.scrollTop与document.documentElement.scrollTop
renxing518的博客
07-19 2481
1、各浏览器下 scrollTop的差异 IE6/7/8： 对于没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 ； 对于有doctype声明的页面则可以使用 document.documentElement.scrollTop  ； Safari: safari 比较特别，有自己获取scrollTop的函数 ： w
document.body.scrollTop的值总为零的解决办法
热门推荐
sleepwalker_1992的专栏
06-13 2万+
1、document.body.scrollTop的值总为零的原因 有一个功能需要判断下拉的距离，设置头部固定导航栏的颜色。 代码如下： &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" c
js获取滚动条位置
狂飙的蜗牛
04-03 9237
获取坐标： IE  (event.x  event.y)  获取滚动条位置：     document.body.scrollTop （滚动条离页面最上方的距离）     document.body.scrollLeft   （滚动条离页面最左方的距离） 当我用js获取当前垂直或者水平方向滚动条位置的时候，使用"document.body.scrollTop"或者"docume
const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; console.log(scrollTop);以上代码在获取页面滚动高度，打印不出来数据，为什么
06-03
可能是因为在代码执行时，页面还没有滚动，因此获取到的滚动高度为0，导致打印不出来数据。如果需要在页面滚动时动态获取滚动高度并打印出来，可以将代码放在滚动事件监听函数中。例如： ``` window.addEventListener('scroll', function() { const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; console.log(scrollTop); }); ``` 这样，每次滚动页面时都会触发滚动事件监听函数，从而动态获取滚动高度并打印出来。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值