开发中遇到的问题（一）window 下拿不到 $(document).scrollTop()

最新推荐文章于 2024-09-01 12:28:44 发布
最新推荐文章于 2024-09-01 12:28:44 发布
阅读量1k 收藏
点赞数
分类专栏： 开发中遇到的问题 文章标签： scrollTop window 
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43868692/article/details/97896055
版权

今天开发的过程中遇到 在window 下拿不到 $(document).scrollTop() ，这让我很郁闷因为导航头部是共用的。

最终发现有两个css文件，另一个文件中把body的高度设置成了100%；在把html,body的高度样式设置为100%的情况下那麽$(window).scroll方法将检测不到正确的滚出高度（0），导致滚动监听事件失效，解决方法：设置html,body{height:auto}；

原因：

解决办法： 

补充：

$(document)是获取文档对象 
$(window)是获取窗口对象 

初来乍到到
关注
专栏目录
关于window.pageYOffset和document.documentElement.scrollTop
09-05
在Web开发中，特别是在处理页面滚动事件时，`window.pageYOffset` 和 `document.documentElement.scrollTop` 是两个非常重要的属性。它们都是用来获取用户在浏览器窗口中滚动的位置，即浏览器视口距离文档顶部的距离...
document.documentElement && document.documentElement.scrollTop
10-30
在JavaScript中，`document.documentElement` 和 `document.documentElement.scrollTop` 是两个非常重要的属性，它们与网页文档的DOM（Document Object Model）交互，特别是涉及到页面滚动时的行为。本文将深入讲解...
滚动条JS中document.body.scrollTop不起作用的原因
huashufengshizizhou的专栏
06-09 3231
<br />原来在HTML文件头部声明了这样一句：<br /><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><br /><br />改成这样就好了：<br /><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><br />但页面中就忽略了margin的居中了，在google里查
jQuery中 $(document).scrollTop()与 $(window).scrollTop()区别
littlebearGreat——宁静致远
08-14 4106
前些天遇到了，针对浏览器窗口的滚动条，结果在ie下有兼容性，就查了一下，整理 jQuery中，$(document).scrollTop()与 $(window).scrollTop()效果完全相同 但是，(window).scrollTop()被所有浏览器支持 所以，以后尽量用(window).scrollTop()
jQuery入门（六）jQuery实现瀑布流分页案例
最新发布
kong7906928的博客
09-01 423
瀑布流分页,jquery实现瀑布流分页
document.body.scrollTop总是零的原因
秤砣的专栏
07-22 1879
原来在HTML文件头部声明了这样一句：http://www.w3.org/TR/html4/loose.dtd">改成这样就好了：但页面稍有变化，感觉不爽，于是又在google里找，终于发现这是IE5与IE6的区别：var scrollPos; if (typeof window.pageYOffset != undefined) {    scrollPos = window.pageYOf
jq概念笔记
林中明月间丶
04-10 543
只能输入纯数字的输入框:<input type="text" name="" oninput="value=value.replace(/[^\d]/g,'')"> //放心使用很强大 jQuery中$()可以有两个参数 var $box = $('div.work_content'); var $txt = $('div.model-select-text',$box); ...
document.body.scrollTop指定位置失效解决办法
u013278374的专栏
06-25 8094
近期在vue的pc项目中，做指定位置定位的时候发现使用document.body.scrollTop一直不生效。解决办法是document.body.scrollTop改成document.documentElement.scrollTop
Uncaught TypeError: $(...).scrollTo is not a function
xiamen517的博客
08-28 1万+
在添加产品点击提交时报JS错误如下： scrollTo是原生JS提供的一个函数，可把内容滚动到指定的坐标。用法如下： scrollTo(xpos,ypos) 参数 描述 xpos 必需。要在窗口文档显示区左上角显示的文档的 x 坐标。 ypos 必需。要在窗口文档显示区左上角显示的文档的 y 坐标。
Document.body.scrollTop的值总为零的快速解决办法
09-02
在JavaScript中，`document.body.scrollTop` 是一个常用于获取网页滚动条顶部到页面内容顶部的距离的属性。然而，有时候你会发现这个属性的值始终为零，即使页面已经进行了滚动。这通常与文档类型声明（DOCTYPE）...
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
09-05
这段代码首先尝试获取`window.pageYOffset`，如果浏览器不支持，则回退到`document.documentElement.scrollTop`，如果还不行，再尝试`document.body.scrollTop`，最后如果所有尝试都失败，将`scrollTop`设为0。...
(document).height()、$(document).scrollTop()
倾城一笑stu
09-20 1950
jQuery(window).height()代表了当前可见区域的大小，而jQuery(document).height()则代表了整个文档的高度，可视具体情况使用. 注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window).height() 随之改变jQuery(document).height()是不变的。 $(document).scrollTop() 获
document.body.scrollTop总是0的原因
Bug 无处不在！
02-09 1万+
最近写了一个拖动层的HTML页面,   需要获取滚动条当前的位置.于是我使用document.body.scrolltop获取y方向滚动的位置...奇怪的事情出现了! 无论滚动条怎么滚动, document.body.scrolltop竟然一直都是0!对比以前写的一个页面.发现区别很小. 旧页面却没有问题.这就怪了...我开始一点一点的排除,去掉多于的代码. 直到我去掉文档最顶部的
关于js中 document.body.scrollTop 不能返回正确值的原因
netingcn
06-25 5586
本来是为了通过document.body.scrollTop来获取浏览器垂直滚动条向下滚动的像素，但是不管滚动条在什么位置总是返回是0，造成这样的原因和html的头部声明有关，如果头部声明 为：http://www.w3.org/TR/html4/loose.dtd">，这样肯定得到的结果是 0，如果该为就能得到正确的结果，对于第一种头部声明想要得滚动条的滚动的高度怎么办，解决方法有两种1、v
vue页面跳转后，滚动条不在顶部
halo1416的博客
07-21 2620
一、问题描述 vue在将页面滚动到页面中部或者底部（反正不在顶部），再进行页面跳转后，新页面的滚动条还处于上一个页面的位置，并没有更新到页面顶部 二、解决方法 在全局路由钩子里面将页面滚动到页面顶部 router.beforeEach((to, from, next) => { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; // 兼容IE window.scrollT
scrollTop设置不起效果的几种原因
smallNut的博客
01-17 1万+
今天在写需求的时候遇到一个要将表格的滚动条在进行路由跳转时固定的操作，然后没想到居然在scrollTop这个属性的设置上栽了坑，关于此问题的原因网络上的解释也五花八门，各不相同 这里我们以下图demo为例，给大家解释一下设置scrollTop属性设置无效可能会遇到的几个原因 1.父，子元素需设置高度，并且子元素高度必须大于父元素 这一点应该很好理解，如果子元素高度始终小于父元素，那么无论怎么设置scrollTop的值都不可能大于0 2.父元素需设置overflow: scroll 或 overflow-y：
$(window).scrollTop()和$(document).scrollTop()区别
骆小胖~
08-24 4829
对浏览器窗口的滚动条，两者在ie下有兼容性，       jQuery中，$(document).scrollTop()与 $(window).scrollTop()效果完全相同       但是，$(window).scrollTop()被所有浏览器支持所以，以后尽量用$(window).scrollTop()
开发中遇到的bug-Property or method “xxxx“ is not defined on the instance but referenced during render.
热门推荐
火腿肠的博客
10-10 1万+
method没加s加上就好了 <body> <div id="app"> <button @click="sub">-</button> <span>{{code}}</span> <button @click="add">+</button> </div> <script> var app = new
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、付费专栏及课程。

余额充值