为了账号安全,请及时绑定邮箱和手机立即绑定

如何用JavaScript获取整个文档的高度?

如何用JavaScript获取整个文档的高度?

狐的传说 2019-06-27 16:34:38
如何用JavaScript获取整个文档的高度?有些文档我无法获得文档的高度(将某些东西绝对定位在最下面)。此外,填充底部似乎在这些页面上什么都不做,但是在将返回高度的页面上执行。有关案例:http://fandango.comhttp://paperbackswap.com论范丹戈jQuery$(document).height();返回正确的值document.height返回0document.body.scrollHeight返回0平装书交换:jQuery$(document).height();TypeError:$(document)为空document.height返回不正确的值。document.body.scrollHeight返回不正确的值。注意:我有浏览器级别的权限,如果有什么窍门的话。
查看完整描述

3 回答

?
繁星点点滴滴

TA贡献1803条经验 获得超3个赞

文档大小是浏览器兼容性的噩梦,因为尽管所有浏览器都公开了clientHight和ScrollHight属性,但它们并不都同意如何计算值。

过去有一个复杂的最佳实践公式,你如何测试正确的高度/宽度。这涉及使用document.documentElement属性(如果可用的话),或者返回文档属性等等。

获得正确高度的最简单方法是获取在文档或文档元素中找到的所有高度值,并使用最高的高度值。这基本上就是jQuery所做的:

var body = document.body,
    html = document.documentElement;var height = Math.max( body.scrollHeight, body.offsetHeight, 
                       html.clientHeight, html.scrollHeight, html.offsetHeight );

用Firebug+进行快速测试jQuery书签返回两个引用页面的正确高度,代码示例也是如此。

注意,在文档准备好之前测试文档的高度总是会导致0。此外,如果您加载更多的内容,或用户调整窗口大小,您可能需要重新测试。使用onload或者是文件就绪如果您需要在加载时执行此操作,则只需在需要该号码时进行测试。


查看完整回答
反对 回复 2019-06-27
?
慕斯王

TA贡献1864条经验 获得超2个赞

这是一个很老的问题,因此有许多过时的答案。截至2017年,所有浏览器都遵守了这一标准。

document.body.scrollHeight

编辑:上面没有在<body>算上标签。如果您的身体有边缘,请使用:

document.documentElement.scrollHeight


查看完整回答
反对 回复 2019-06-27
?
隔江千里

TA贡献1906条经验 获得超10个赞

您甚至可以使用这个:

var B = document.body,
    H = document.documentElement,
    heightif (typeof document.height !== 'undefined') {
    height = document.height // For webkit browsers} else {
    height = Math.max( B.scrollHeight, B.offsetHeight,H.clientHeight, H.scrollHeight, H.offsetHeight );}

或者以更好的jQuery方式(因为正如您所说的,jQuery不说谎):)

Math.max($(document).height(), $(window).height())


查看完整回答
反对 回复 2019-06-27
  • 3 回答
  • 0 关注
  • 1124 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号