js获取正文以及屏幕高度

最新推荐文章于 2025-09-12 16:56:45 发布

转载最新推荐文章于 2025-09-12 16:56:45 发布 · 93 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/nidilzhang/archive/2010/01/11/1644477.html

文章标签：

#javascript #ViewUI

本文介绍了一种使用JavaScript来获取网页的各种尺寸信息及屏幕分辨率的方法。通过这段代码可以了解到如何读取网页可见区域的宽高、正文全文的宽高、被卷去的高度和左侧位置等，同时也能得到屏幕分辨率的具体数值。

<html>

<head>

</head>

<body>

var s = "";

s += "\r\n网页可见区域宽："+ document.body.clientWidth;

s += "\r\n网页可见区域高："+ document.body.clientHeight;

s += "\r\n网页可见区域高："+ document.body.offsetWeight +" (包括边线的宽)";

s += "\r\n网页可见区域高："+ document.body.offsetHeight +" (包括边线的宽)";

s += "\r\n网页正文全文宽："+ document.body.scrollWidth;

s += "\r\n网页正文全文高："+ document.body.scrollHeight;

s += "\r\n网页被卷去的高："+ document.body.scrollTop;

s += "\r\n网页被卷去的左："+ document.body.scrollLeft;

s += "\r\n网页正文部分上："+ window.screenTop;

s += "\r\n网页正文部分左："+ window.screenLeft;

s += "\r\n屏幕分辨率的高："+ window.screen.height;

s += "\r\n屏幕分辨率的宽："+ window.screen.width;

s += "\r\n屏幕可用工作区高度："+ window.screen.availHeight;

s += "\r\n屏幕可用工作区宽度："+ window.screen.availWidth;

alert(s);

</SCRIPT>

</body>

</html>

转载于:https://www.cnblogs.com/nidilzhang/archive/2010/01/11/1644477.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_30627381

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

js取得文档的高度和宽度

程序猿

06-30

7538

网页可见区域宽：document.body.clientWidth 网页可见区域高：document.body.clientHeight 网页可见区域宽：document.body.offsetWidth (包括边线的宽) 网页可见区域高：document.body.offsetHeight (包括边线的宽) 网页正文全文宽：document.body.scrollWidth

关于定位坐标的一些实用方法

weixin_34274029的博客

10-23

511

为什么80%的码农都做不了架构师？>>> ...

参与评论您还未登录，请先登录后发表或查看评论

js获取文本高度和屏幕高度

weixin_42260706的博客

12-04

4990

网页可见区域宽： document.body.clientWidth 网页可见区域高： document.body.clientHeight 网页可见区域宽： document.body.offsetWidth (包括边线的宽) 网页可见区域高： document.body.offsetHeight (包括边线的高) 网页正文全文宽： document.body.scrollWidth ...

js获取文档高度

zjl516088421的博客

09-02

2605

JS获取页面高度、宽度

weixin_38204723的博客

12-05

3280

JS 获取浏览器窗口大小 // 获取窗口宽度 if (window.innerWidth) winWidth = window.innerWidth; else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; // 获取窗口高度 if (window.in

js获取屏幕高度

不忘编码

05-07

6096

document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 vue使用 document.documentElement.clientHeight/window.innerHeight ...

js获取网页可见区域、正文以及屏幕分辨率的高度

10-25

标题“js获取网页可见区域、正文以及屏幕分辨率的高度”所涵盖的知识点主要集中在如何使用JavaScript来测量网页上的不同区域的高度。在网站开发和维护过程中，对页面尺寸的精准测量对于页面布局和响应式设计至关重要...

js获取浏览器和屏幕的各种宽度高度

10-20

本文将介绍如何使用JavaScript来获取浏览器窗口的宽度和高度以及屏幕的尺寸，并解释在不同浏览器环境下如何兼容地获取这些信息。首先，我们来介绍获取浏览器窗口的可见区域宽高。可见区域指的是不包含浏览器工具栏...

JS获取屏幕高度的简单实现代码

10-22

在讨论如何用JavaScript获取屏幕高度之前，首先应该了解浏览器提供的窗口尺寸相关信息的属性。这些属性虽然听起来相似，但在不同浏览器和不同的页面布局下却有不同的表现。获取屏幕高度和浏览器窗口高度是Web开发中...

javascript 各种得到浏览器宽度和高度的函数

weixin_34392435的博客

09-28

254

2019独角兽企业重金招聘Python工程师标准>>> ...

jquery js获取移动设备浏览器高度

weixin_30929295的博客

01-21

350

document.documentElement.clientHeight 高度document.documentElement.clientWidth 宽度兼容ie6+ 转载于:https://www.cnblogs.com/nc-blog/p/4238134.html

js获取整个页面文档的总宽高

qq_33455240的博客

05-22

5592

必须取得scrollWdith/clientWidth和scrollHeight/clientHeight中的最大值用代码实现如下：var docHeight = Math.max(document.documentElement.scrollHeight,document.documentElement.clientHeight);var docWidth = Math.max(document...

clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

weixin_38170862的博客

09-19

283

网页可见区域高：document.body.clientHeight 网页正文全文高：document.body.scrollHeight网页可见区域高（包括边线的高）：document.body.offsetHeight网页被卷去的高：document.body.scrollTop 屏幕分辨率高：window.screen.height clientHeight：包括paddin...

《Linux运维总结：Redis7.4.5哨兵集群开启ACL并配置用户》

东城绝神

09-12

549

《Linux运维总结：Redis7.4.5哨兵集群开启ACL并配置用户》

前后端开发Mock作用说明，mock.ts

循环编织时间年轮，递归叩问存在本质，谁能在硅基荒原上，种出思想的玫瑰……

09-12

375

mock.ts是前端开发中用于模拟后端接口的TypeScript文件，通过生成虚假数据使前端无需等待后端即可独立开发。它定义数据结构、模拟请求响应，并提供与真实接口一致的调用方式。示例展示了如何生成用户数据并模拟分页接口，使用vite-plugin-mock等工具实现。前端代码调用Mock接口与调用真实接口方式相同，待后端完成时只需替换接口地址即可平滑切换，实现了前后端并行开发。

JavaScript的功能和作用

2402_83164836的博客

09-10

502

JavaScript（简称 JS）是一种，最初设计用于为网页添加动态交互功能。经过多年发展，其应用场景已远超浏览器，成为覆盖前端、后端、移动端、桌面端甚至物联网等领域的“全场景语言”。

＜uniapp＞＜指针组件＞基于uniapp，编写一个自定义箭头指针组件

用沸腾的热血，支付我们的人生吧！

09-10

412

本文介绍了基于uniapp开发的自定义带箭头指针组件，通过SVG实现直线和箭头的组合效果。组件支持设置长度、颜色、角度等参数，并提供三种箭头规格(small/normal/big)可选。文章详细讲解了SVG结构的实现过程，包括计算终点坐标、响应式参数处理等核心功能，并展示了不同配置下的指针效果。该组件可用于时钟指针等场景，具有灵活性和复用性特点。

JavaScript经典面试题二（函数和作用域）

最新发布

weixin_43746297的博客

09-12

981

摘要：本文系统介绍了JavaScript中12个核心函数概念，包括闭包、作用域、函数绑定方法、高阶函数、箭头函数、生成器函数、防抖节流、递归、纯函数、函数重载和偏函数。重点解析了闭包的定义、实现原理及4种应用场景；详细对比了call/apply/bind三者的区别；深入探讨了箭头函数与普通函数的4个关键差异；分析了防抖节流的实现逻辑和应用场景；总结了递归的优缺点和使用建议；阐释了纯函数的定义和优势；说明了如何在JavaScript中模拟函数重载；介绍了偏函数的概念和实现方式。这些内容全面覆盖了JavaScr

Linux Node.js 安装及环境配置详细教程

csdn_aspnet的专栏，请点击博客主页右上角三个点中的私信联系

09-11

919

本文介绍了Node.js及其包管理工具npm的基本概念，并提供了详细的Linux环境安装配置指南。Node.js是基于Chrome V8引擎的JavaScript运行环境，使JavaScript能够用于服务端开发。npm是Node.js的包管理工具，类似于Maven，可自动处理依赖关系。文章详细讲解了从官网下载Node.js安装包到Linux服务器的步骤，包括解压、创建软连接、环境变量配置等操作，最后通过node -v和npm -v命令验证安装是否成功。该教程适用于需要在CentOS7系统上部署Node

JS 获取网页屏幕高度

08-30

在JavaScript中，有多种方法可以获取网页屏幕高度： 1. **使用`screen`对象的`height`属性**：此属性可获取用户计算机屏幕的高度（单位为像素）。示例代码如下： ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>JavaScript</title> </head> <body> <button type="button" onclick="getResolution();">获取屏幕的高度</button> <script type="text/javascript"> function getResolution() { alert("您计算机屏幕的高度为：" + screen.height); } </script> </body> </html> ``` 该方法可以获取整个屏幕的高度，适用于需要了解设备屏幕整体尺寸的场景[^1]。 2. **使用`window.screen.availHeight`**：该属性返回屏幕可用工作区的高度，即不包括任务栏等系统占用区域的高度。示例代码如下： ```javascript function getAvailableScreenHeight() { var availableHeight = window.screen.availHeight; console.log("屏幕可用工作区高度：" + availableHeight); } getAvailableScreenHeight(); ``` 这种方式对于根据实际可用空间来布局页面元素非常有用，比如在开发桌面应用程序的网页版时，可避免元素被系统任务栏遮挡[^3]。 3. **使用`window.innerHeight`**：`window.innerHeight`返回浏览器窗口的内部高度，包括滚动条，但不包括浏览器的工具栏和菜单栏等。示例代码如下： ```javascript let innerHeight = window.innerHeight; console.log("浏览器窗口内部高度：" + innerHeight); ``` 此方法适合需要根据浏览器窗口内实际可显示内容的区域来布局页面的场景，例如实现响应式布局时，根据窗口高度动态调整元素的大小和位置[^2]。 4. **使用`document.body.clientHeight`**：`document.body.clientHeight`返回网页可见区域的高度，不包括滚动条和边框。示例代码如下： ```javascript var visibleHeight = document.body.clientHeight; console.log("网页可见区域高度：" + visibleHeight); ``` 该方法适用于需要了解网页实际可见内容区域高度的情况，比如在实现一些自适应高度的容器时使用[^3][^4]。