body.clientHeight与documentElement.clientHeight

最新推荐文章于 2022-01-03 20:51:07 发布
最新推荐文章于 2022-01-03 20:51:07 发布
阅读量127 收藏
点赞数
原文链接：http://www.cnblogs.com/lydialee/p/4860978.html
版权

 

 

body上的clientHeight会对着内容区域的高度变化而变化，当内容只有100px，则body上只有100px被撑起，返回的clientHeight为100；

documentElement.clientHeight:不会随着内容区域的变化而变化，始终是窗口的可见区域大小。

转载于:https://www.cnblogs.com/lydialee/p/4860978.html

weixin_34116110
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
关于body.clientHeight，body.clientWidht获取的不是可视高度的问题
qq_42814833的博客
08-05 652
我发现网上一些教程可能都是10几年前的老古董了，经过不知道多少号复制翻新，导致有时候你很难去发现问题，甚至是大部分的教程都是这么写的，害人不浅。问题的经过是这样的，我需要获取页面的可视高度。网上搜一搜，全部都说使用body.clientHeight来获取，结果嘛获取的是body的总高度。总结一下，在标准模式下使用根节点来获取可视高度才是正确的。要使用的是根节点的clientHeight，也就是。所谓标准模式的判定是你在HTML文件上方声明了。经过我一番查找，发现问题所在。下才能返回可视高度，在。......
document.body.clientHeight 只是窗口高度四舍五入的结果，宽度也是如此
weixin_44350171的博客
12-19 3174
在测试拖拽时，要实现被拖拽的元素不能跟鼠标一起跑到窗口外； 所以 在style.top<0时使其style.top=0 在style.top<document.body.clientHeight - div1.offsetHeight时，使其style.top=document.body.clientHeight - div1.offsetHeight（即窗口高度 减去 元素高度，就是元素能被拖拽到的最低位置，当小于这个最小值时，直接把最小值赋值给它） 但是出现了一个bug，如下图 按理说我把
关于JavaScript中document.body.clientHeight获取页面高度为0的问题及解决方案
chad273的博客
01-03 3250
js中如下语句 h = document.body.clientHeight； 获得的 h 值始终为0，找了半天终于解决，将代码改写如下即可： h = document.documentElement.clientHeight； 初学js，具体原因还不懂，貌似和DOM中从层次不同有关，有待继续学习研究。同时希望大神帮忙解答。 ...
document.documentElement.clientHeight与document.body.clientHeight的区别
天空之上有座城
04-08 2495
网页可见区域高：document.body.clientHeight 网页正文全文高：document.body.scrollHeight clientHeight： 表示可视区域高度， 包括padding但不包括border、水平滚动条、margin的元素的高度 offsetHeight：表示可视区域高度，包括padding、border、水平滚动条，但不包括margin的元素的高度 ...
让body的clientHeight与html的clientHeight相等的方法
dayanwu2842的博客
05-03 98
body元素是自适应高度的块级元素，当页面内容比较少时，它的高度会小于默认浏览器的可是区域高度；html元素的高度是默认等于浏览器视窗的高度的 从文档结构上来说 body是html的子元素，按道理设置body{ height:100%;},可以让它和html元素高度相等，实际发现没没效果。需要设置 html,body{height:100%}才能让两者的高度相等 测试代码如下： ...
doctype后如何获得body.clientHeight的方法
12-02
在ie6中很多js脚本执行就会出现问题，一般是在获取clientWidth, clientHeight,... 比如：原来document.body.clientHeight，就要改成document.documentElement.scrollTop 为了自适应，可以改了下代码： ((docum
用document.documentElement取代document.body的原因分析
01-19
上次的测试说明了document.body属性并不会给我们返回预期的结果，比如我们用document.body.clientHeight原本想取得“页面可见区域高度”，可实际上返回的是“页面实际内容高度”。 那我们怎么办呢？难道加上了文档...
IE与FF下javascript获取网页及窗口大小的区别详解
01-19
在新定义出来的标准下 document.documentElement.clientHeight在IE和火狐里都能获取正确值，下面一篇文章详细介绍了获取各种浏览器可见窗口大小这方面的差别： [removed]function getInfo(){ var s = “”; s += ...
取得窗口大小 兼容所有浏览器的js代码
12-11
取得窗口大小的代码： 代码如下: var pageWidth = window.innerWidth, var pageHeight = window.innerHeight;... pageHeight = document.documentElement.clientHeight; }else{ pageWidth = document.body.clie
index.html
05-27
let maxH = document.documentElement.clientHeight - 50, maxW = document.documentElement.clientWidth - 50; //监听resize，改变maxH,maxW window.onresize = function(){ maxH = document....
关于document.body、document.documentElement和window获取视窗大小的区别
weixin_37469563的博客
08-22 1363
$(window).height(); 才是窗口的宽高，而且一直不变  document.body.clientHeight，在文档内容有滚动条的时候远大于$(window).height() 总之： document.documentElement.clientWidth 获取的可视区域的宽度高度（缩放窗口的时候 值会发生变化） document.body.clientHeigh
获取可视区域高度赋值给div（解决document.body.clientHeight的返回值为0的问题）
Lambda
01-03 3308
获取可视区域高度赋值给div（解决document.body.clientHeight的返回值为0的问题） 设置html,body{height:100%} 在使用html5文档类型的时候， 设置了html body的高度100%之后，两个浏览器就都能获取document.body.clientHeight了 DOCTYPE html> html> head>
documen.body.clientHeight的取值问题。
weixin_34220179的博客
12-24 310
有的时候要去页面的顶部到底部的高度时就要用到document.body.clientHeight来获得。 在HTML中无论body的高度是多少只要用documen.body.clientHeight就能获得到底有多高，例如：1074*768分辨率取得的值就是768.即使body中只有一句“hello world” 也能获得到底的高度。 但是在XHTML中如果body只有一行的话，那么使用d...
[JS]document.body.clientHeight的取值
weixin_30550271的博客
01-05 191
有时候需要取页面的底部, 就会用到document.body.clientHeight , 在HTML 标准中(这一句就能取到整个页面的高度, 不论body 的实际内容到底有多高, 例如, 1074*768 的分辨率, 页面最大化时, 这个高度约为720 , 即使页面上只有一句"hello world" , 也仍然取到720. 可是在XHTML中, 如果body 体中只有一行, 则documen...
document.body.clientHeight返回值为0的解决方案
热门推荐
web前端菜鸟工程师
01-12 1万+
最近在做一个div内容高度在不同浏览器下的高度自适应，发现document.body.clientHeight的返回值为0. 网上查了一下， 貌似有很多个解决方案。  1. 使用document.documentElement.clientHeight获取。  当使用html5的时候，就会有documentElement在document下。  如上图所示 ， 左边为c
document.body元素上的clientHeight, offsetHeight, scrollHeight
ForMyQianDuan的博客
04-27 2893
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style&gt; html, body { height: 100%
文档类型声明对document.body.clientHeight的取值影响
mengyuying16的博客
08-30 670
有时候我们想要获取浏览器可视窗口（页面）的宽度和高度，会使用 document.body.clientWidth document.body.clinetHeight 但是，会发现在html文档头部的那个文档类型声明，会对document.body.clinetHeight发生区别。 1、不做任何文档类型声明时候，可以获取到页面的高度.（1366 662 是我电脑浏览器页面的宽度和高度）
// 可见区域高度 let clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
最新发布
06-13
其中，`window.innerHeight`表示浏览器窗口的内部高度，`document.documentElement.clientHeight`表示文档根元素的可见高度，`document.body.clientHeight`表示文档body元素的可见高度，三者取最小值作为可见区域...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值