document.body.scrollTop,document.body.clientHeight的值为0的问题

最新推荐文章于 2022-01-03 20:51:07 发布
最新推荐文章于 2022-01-03 20:51:07 发布
阅读量2k 收藏
点赞数
文章标签： xhtml html 文档
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yanshujun/article/details/4464192
版权

憋了我好久 终于在网上找到了答案：
在写个漂浮广告时遇到document.body.scrollTop和document.body.clientHeight为零的问题，在网上找到了原因：是因为html/jsp文件头部加了文档类型。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">

解决办法可以有两个（使用第二个好点）

１.去掉头部文档类型。

２.把document.body.scrollTop和document.body.scrollLeft这两个家伙改个名字：

document.documentElement.scrollTop 和document.documentElement.scrollLeft。

当然document.body.clientWidth和document.body.clientHeight也要改名字了，改为：document.documentElement.clientWidth和document.documentElement.clientHeight


本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/lgh731/archive/2009/03/17/3998949.aspx

yanshujun
关注
关于scrollHeight和scrollTop取值为0的问题
qq_31965515的博客
10-26 7139
js:关于scrollHeight和scrollTop取值为0的问题 obj.offsetTop 指 obj 距离上方或上层控件的位置，整型，单位像素。 obj.offsetLeft 指 obj 距离左方或上层控件的位置，整型，单位像素。 obj.offsetWidth 指 obj 控件自身的宽度，整型，单位像素。 obj.offsetHeight 指 obj 控件自身的高度，整型，单位像...
由document.body和document.documentElement想到的
09-06
在Web开发中，理解和掌握`document.body`和`document.documentElement`的区别至关重要，尤其是在处理页面布局和兼容性问题时。这两个对象分别代表了HTML文档的不同部分：`document.body`指的是HTML文档的实际内容...
获取可视区域高度赋值给div（解决document.body.clientHeight的返回值为0的问题）
weixin_33892359的博客
12-04 183
设置html,body{height:100%} 在使用html5文档类型的时候， 设置了html body的高度100%之后，两个浏览器就都能获取document.body.clientHeight了 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
html5中document.body.clientHeight返回0
rongyong的专栏
03-12 2102
在CSS中设置：html,body{height:100%;}
关于document.body.clientHeight的返回值为0的问题
Panda0218的博客
01-14 3629
有时候我们需要去获取body的高度，但是通过document.body.clientHeight却得到值是0。那么如何解决这个问题呢？ 我们只需要将html和body的css样式中添加属性height:100%;即可。 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;titl...
关于JavaScript中document.body.clientHeight获取页面高度为0的问题及解决方案
chad273的博客
01-03 3338
js中如下语句 h = document.body.clientHeight； 获得的 h 值始终为0，找了半天终于解决，将代码改写如下即可： h = document.documentElement.clientHeight； 初学js，具体原因还不懂，貌似和DOM中从层次不同有关，有待继续学习研究。同时希望大神帮忙解答。 ...
document.documentElement和document.body区别介绍
09-05
在标准模式下，则需要先判断document.documentElement.scrollLeft和document.documentElement.scrollTop是否为0，若是则使用document.body.scrollLeft和document.body.scrollTop。 了解了这些区别后，前端开发者在...
document.body.scrollTop用法
12-16
- 在处理跨浏览器兼容性问题时，建议使用 `document.documentElement.scrollTop` 而不是 `document.body.scrollTop`。 - 使用 `window.scrollTo` 或 `window.scrollBy` 方法时，注意它们在不同浏览器中的兼容性差异...
用document.documentElement取代document.body的原因分析
01-19
上次的测试说明了document.body属性并不会给我们返回预期的结果，比如我们用document.body.clientHeight原本想取得“页面可见区域高度”，可实际上返回的是“页面实际内容高度”。 那我们怎么办呢？难道加上了文档...
bootstrap拖拽组件集成echarts图表，图表div的clientWidth、clientHeight始终为0，导致无法生成图表问题
zhangyongbink的博客
03-09 615
1.问题点：生成图表的div被包含到一个样式含有display:none的上级..节点，这个样式是拖拽组件所设定的，无法更改。导致图表生成不了。 2：试过解决的方法：手动设置div的宽高、寻找上上级等节点的宽高，，都无法解决，因为即使有宽高，但echarts会判断div的clientWidth和heightClient，问题无法解决。 3.经过多次尝试，发现拖拽组件是相应拷贝一份到目标...
document.body.clientHeight返回值为0的解决方案
weixin_33871366的博客
11-20 124
http://www.thinksaas.cn/group/topic/306287/ 使用HTML5 DOCTYPE，会出现document.body.clientHeight为0 网上查了一下， 貌似有很多个解决方案。 1. 使用document.documentElement.clientHeight获取。 当使用html5的时候，就会有documentElement在docum...
document.documentElement.clientWidth
CL1250887989的博客
04-25 331
关于获取各种浏览器可见窗口大小的一点点研究<script>function getInfo(){var s = "";s = " 网页可见区域宽：" document.body.clientWidth;s = " 网页可见区域高：" document.body.clientHeight;s = " 网页可见区域宽：" document.body.offsetWidth " (...
document.body.clientHeight 和 document.documentElement.clientHeight 的区别以及tomcat中路径大小写的问题...
weixin_33893473的博客
08-12 500
1、javascript中的 document.body.clientHeight 和 document.documentElement.clientHeight 的区别 这个问题是我在整合新的美工页面的时候发现的，在整合页面的时候菜单页面始终显示不出来。但是查看源代码，里面又已经打印出来了所有的菜单。唯一的解释就是js的问题了。用火狐firebug测试，发现其中一个取得页面高度的变量 b...
为什么scrollTop设置后一直为0的解释和解决方案（精品）
热门推荐
kouryoushine的博客
08-19 4万+
背景 做前端希望页面能跳转到 某一位置用到了scrollTop属性。可是发现给某个div设置该属性后，一致为0。找了很多方案，但不都适合自己，或者说不知道是否适合。 Why scrollTop==0? 总而言之，所有情况都是因为你给一个没有滚动条的元素设置滚动条的位置。 什么时候存在滚动条？ 页面布局我们可以简单理解为 div盒子套div盒子。当内侧div盒子的高度大于外部时，外部的div就会出现...
document.body.clientHeight 和 document.documentElement.clientHeight 的区别
qupeng666的博客
08-28 614
当页面上有DOCTYPE的时候,值为 document.body.clientHeight = 54px  //页面实际内容高度 document.documentElement.clientHeight = 729px //浏览器可视化区域高度 当没有DOCTYPE时 document.body.clientHeight = 729px  document.document
document.documentElement.scrollHeight 只能获取到一般高度
最新发布
10-12
`document.documentElement.scrollHeight` 是JavaScript中用于获取文档元素滚动区域高度的一个属性。它返回的是从视口顶部到底部的实际内容高度，包括已经被用户滚动的内容。然而，这个值并不总是等于浏览器窗口的总高度，因为可能会有滚动条、工具栏等其他非可视部分。 当仅需要获取页面可见内容的高度时，它是一个有用的工具。如果需要获取整个浏览器窗口的高度，应该加上滚动条的高度： ```javascript var windowHeight = document.documentElement.clientHeight; var scrollHeight = document.documentElement.scrollHeight; var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; var totalHeight = windowHeight + scrollTop; ``` 这里`windowHeight`代表可视区域高度，`scrollHeight`是实际内容高度，`scrollTop`是滚动条的距离。总高度`totalHeight`则是两者之和。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值