`
davidxiaozhi
  • 浏览: 241563 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js中常用的宽高获取

工作浏览器 
阅读更多

四种浏览器对 clientHeight、offsetHeight、scrollHeight、clientWidth、offsetWidth 和 scrollWidth 的解释差异

网页可见区域宽：document.body.clientWidth
网页可见区域高：document.body.clientHeight
网页可见区域宽：document.body.offsetWidth (包括边线的宽)
网页可见区域高：document.body.offsetHeight (包括边线的宽)
网页正文全文宽：document.body.scrollWidth
网页正文全文高：document.body.scrollHeight
网页被卷去的高：document.body.scrollTop
网页被卷去的左：document.body.scrollLeft
网页正文部分上：window.screenTop
网页正文部分左：window.screenLeft
屏幕分辨率的高：window.screen.height
屏幕分辨率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availHeight
屏幕可用工作区宽度：window.screen.availWidth
网页可见区域宽：document.body.clientWidth
网页可见区域高：document.body.clientHeight
网页可见区域宽：document.body.offsetWidth (包括边线的宽)
网页可见区域高：document.body.offsetHeight (包括边线的宽)
网页正文全文宽：document.body.scrollWidth
网页正文全文高：document.body.scrollHeight
网页被卷去的高：document.body.scrollTop
网页被卷去的左：document.body.scrollLeft
网页正文部分上：window.screenTop
网页正文部分左：window.screenLeft
屏幕分辨率的高：window.screen.height
屏幕分辨率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availHeight
屏幕可用工作区宽度：window.screen.availWidth

分享到：
| lucene:no segments* file found in org.ap ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js获取网页宽高

    在JavaScript编程中，获取网页的宽高是一项常见的需求，特别是在页面布局、动态调整元素尺寸或者进行响应式设计时。本文将深入探讨如何利用JavaScript来获取浏览器窗口以及网页内容的宽度和高度。 首先，我们需要...

    js判断图片加载完成后获取图片实际宽高的方法

    在Web开发过程中，获取图片的实际宽度和高度是一个常见的需求。这在响应式设计中尤为重要，因为不同设备的屏幕尺寸不同，需要根据图片的实际尺寸调整布局。在JavaScript中，传统的做法是通过DOM元素的`.offsetWidth`...

    在图片加载完毕前js获取图片长宽尺寸

    目前我们常用的获取图片实际宽度高度的方法，要么是在DOM中写入，要么就是等图片加载完毕后才开始获取，用户体验极其不好，今天特意整理一个办法，可以让javascript在html加载完毕后就可以立即获取img文件的头数据...

    javascript获取隐藏元素(display:none)的高度和宽度的方法

    通过上述讲解，我们可以了解到，在JavaScript中获取display:none元素的尺寸需要通过一些特殊的处理来实现。掌握了这些方法后，对于前端开发中的元素操作会有更加深入的理解，也能够更好地处理一些复杂的情况。

    js获取浏览器高度和宽度值.pdf

    在JavaScript中，获取浏览器的高度和宽度是常见的需求，这有助于我们进行页面布局、响应式设计或者自适应调整。本文将详细解析如何通过JavaScript获取不同浏览器中的浏览器高度、宽度以及相关的一些其他尺寸信息。 ...

    原生js获取宽高与jquery获取宽高的方法关系对比

    在JavaScript和jQuery中，获取元素宽高是常见的需求，它们提供了不同的方法来实现这一功能。在本文中，我们将深入探讨原生JavaScript与jQuery获取元素宽度的差异和关系，并结合具体的属性和方法进行对比。 首先，...

    原生JS上传文件，获取文件二进制数据及文件大小和文件名称

    在前端开发中，上传文件是一项常见的功能，尤其是在用户交互丰富的Web应用中。原生JavaScript提供了强大的能力来处理这种任务，无需依赖外部库如jQuery或React等。本知识点将深入探讨如何使用原生JavaScript实现文件...

    js控制图片缩放 不失真 获取图片真实长和宽

    在JavaScript中，实现图片的等比例缩放以保持不失真是一项常见的需求，特别是在网页设计和动态展示中。这里我们将深入探讨如何实现这一功能，并解决图片在切换时保持正确比例的问题。 首先，我们要明白图片不失真的...

    原生js获取浏览器窗口及元素宽高常用方法集合

    在前端开发中，获取浏览器窗口以及页面元素的宽高是一个经常执行的操作。原生JavaScript为我们提供了多种方法来实现这一需求。本文将详细介绍这些常用方法，并解释它们的应用场景。 1. 获取窗口可视区域的宽度和...

    js获取浏览器宽和高http://www.tiki-toki.com/

    这篇博客“js获取浏览器宽和高”可能详细阐述了如何利用JavaScript来获取这些信息。虽然提供的链接指向了一个错误的地址，但我们可以根据通常的方法来解释这个过程。 1. **浏览器窗口对象**： 在JavaScript中，`...

    js获取文本框的值!js获取浏览器高度和宽度值.pdf

    在 JavaScript 中，可以使用多种方法来获取浏览器高度和宽度值，以下是一些常用的方法： 1. 使用 `document.body` 对象： `document.body.clientWidth` 可以获取网页可见区域的宽度，`document.body.clientHeight`...

    javascript获取隐藏元素(display-none)的高度和宽度的方法.docx

    3. **JavaScript 常用获取元素尺寸的方法**： - `.offsetWidth` 和 `.offsetHeight`：返回元素的宽度和高度，包括内边距和边框。 - `getBoundingClientRect()`：返回元素相对于视口的位置和尺寸。 #### 三、解决...

    uni-app 组件里面获取元素宽高的实现

    在开发过程中，经常会遇到需要获取页面元素宽高的需求，尤其是在进行页面布局调整时，元素的实际尺寸就变得尤为重要。 在uni-app中获取元素宽高的方法通常涉及到了组件的生命周期函数以及uni提供的API。由于页面在...

    获取页面元素实际宽高的属性的使用

    在前端开发中，了解如何准确地获取页面元素的实际宽高是非常重要的。这不仅有助于我们优化页面布局，还能提高用户体验。本文将详细介绍`clientWidth`、`clientHeight`、`scrollWidth`、`scrollHeight`、`offsetWidth...

    javascript获取窗口属性值

    ### JavaScript 获取窗口属性值 在Web开发中，JavaScript是一种广泛使用的编程语言，它能够与HTML和CSS紧密结合，为网页提供动态交互能力。其中一项常见需求是获取浏览器窗口的各种属性值，比如宽度、高度等，这...

    js 获取图像缩放后的实际宽高,位置等信息

    项目中遇到图片实际显示尺寸的判定问题,图片可能被缩放过,所以实际显示的宽高无法通过常见的各种width,height拿到(都是得到图像的自然宽度或者字面宽度,并非实际显示结果) 在网上百度了一大圈也没有找到,今天早上...

    高度,javascript判断上传图片大小，宽度，高度

    在JavaScript中，对上传图片进行大小、宽度和高度的判断是一项常见的前端操作，尤其是在实现用户在网站上上传图片时需要预览和验证图片格式及尺寸的场景。以下是一些关于如何使用JavaScript进行这些判断的关键知识点...

    js获取Html元素的实际宽度高度的方法

    文档中提供的方法是使用JavaScript（简称js）来实现这一功能。为了深入理解和掌握这些知识点，我们需要从几个方面来详细说明。 首先，我们要了解的是JavaScript中获取元素尺寸的基本属性。文档中提到了两种主要情况...

Magicbox
Global site tag (gtag.js) - Google Analytics