js中动态获取页面的高度和宽度的方法总结

旧城等待， 2022-05-09 16:44 223阅读 0赞

**javascript,jquery获取网页的高度和宽度：**

**javascript:**

**可视区域宽：**document.documentElement.clientWidth(width+padding)

**可视区域高：**document.documentElement.clientHeight(height+padding)

**同时也可以使用另一种进行表示：**

**可视区域宽：**document.body.offsetWidth(包括边线的宽：width+padding+border)

**可视区域高：**document.body.offsetHeight(包括边线的高：height+padding+border)

**内容高：**document.body.scrollHeight

**文档高：**document.body.offsetHeight

**纵向滚动的距离：**document.body.scrollTop||document.documentElement.scrollTop

**横向滚动的距离：**document.body.scrollLeft||document.documentElement.scrollLeft

**jquery:**

**可视区域宽：**$(window).width()

**可视区域高：**$(window).height()

**页面文档宽：**$(document).width()

**页面文档高：**$(document).height()

**获取纵向滚动条到左边的垂直距离：**$(document).scrollLeft()

**获取纵向滚动条到顶部的垂直距离：**$(document).scrollTop()

如果您喜欢这篇文章，您的鼓励将是我最大的支持！

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5OTQzMjA_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI5OTQzMjA_size_16_color_FFFFFF_t_70]: /images/20220506/e36f7f96f46445f78b3790dda98bfa20.png

发表评论取消回复

表情：

评论列表（有 0 条评论，223人围观）

还没有评论，来说两句吧...

相关阅读

相关 UNI-APP 动态获取页面剩余高度 //scroll -view高度

需求：动态获取设备高度，页面上部分固定，下面scrollv-view 滚动 data 中定义： windowheight:0 //页面高度； navHeight:0,

柔光的暖阳◎/ 2022年12月25日 04:57/ 0 赞/ 832 阅读

相关【JS】jquery关于获取高宽的方法总结

alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前

淡淡的烟草味﹌/ 2022年12月17日 08:47/ 0 赞/ 130 阅读

相关 JS_js和jq获取屏幕高度、宽度的方法

一、js部分 1.获取屏幕尺寸获取屏幕宽度：window.screen.width; //整个屏幕的宽度获取屏幕高度：window.screen.heigh

刺骨的言语ヽ痛彻心扉/ 2022年11月07日 13:20/ 0 赞/ 13 阅读

相关 [javascript] js 获取页面可视区高度和滚动条高度

获取可视区高度： var clientHeight = document.documentElement.clientHeeight ;

分手后的思念是犯贱/ 2022年08月11日 00:48/ 0 赞/ 277 阅读

相关 js中各种高度和宽度的获取方式

<script> function getInfo() \{ var s = ""; s += " 网页可见区域宽："+ document.body.clien

逃离我推掉我的手/ 2022年08月09日 06:58/ 0 赞/ 171 阅读

相关动态计算UILabel的高度，宽度，自动换行

// // ViewController.m // Company_Code_动态计算字体高度和宽度 // // Created

逃离我推掉我的手/ 2022年08月04日 04:28/ 0 赞/ 219 阅读

相关 js、jQuery获取页面中的各种宽度和高度

在JavaScript和jQuery中，对获取各种高度和宽度都有定义方法和属性，下面我们主要来说明一下获取窗口和文档的高度（宽度与高度相同）。 jQuery中

秒速五厘米/ 2022年07月17日 01:26/ 0 赞/ 407 阅读

相关 js获取页面高度和宽度值

js获取页面高度和宽度值 IE: document.body.clientWidth ==> BODY对象宽度 document.body.clientHe

素颜马尾好姑娘i/ 2022年06月08日 13:17/ 0 赞/ 258 阅读

相关 js中动态获取页面的高度和宽度的方法总结

javascript,jquery获取网页的高度和宽度： javascript: 可视区域宽：document.documentElement.clientWidth(wi

旧城等待，/ 2022年05月09日 16:44/ 0 赞/ 224 阅读

相关 Android获取屏幕宽度高度并动态设置控件宽度，比例等

1、Android获取屏幕宽度的几种方法： //1、通过WindowManager获取 DisplayMetrics dm = new D

傷城~/ 2021年11月23日 08:18/ 0 赞/ 1092 阅读