javascript中获取dom元素高度和宽度的方法如下：

网页可见区域宽： document.body.clientWidth
网页可见区域高： document.body.clientHeight
网页可见区域宽： document.body.offsetWidth (包括边线的宽)
网页可见区域高： document.body.offsetHeight (包括边线的高)
网页正文全文宽： document.body.scrollWidth
网页正文全文高： document.body.scrollHeight
网页被卷去的高： document.body.scrollTop
网页被卷去的左： document.body.scrollLeft

对应的dom元素的宽高有以下几个常用的：

元素的实际高度：document.getElementById("div").offsetHeight
元素的实际宽度：document.getElementById("div").offsetWidth
元素的实际距离左边界的距离：document.getElementById("div").offsetLeft
元素的实际距离上边界的距离：document.getElementById("div").offsetTop

javascript中获取dom元素高度和宽度的更多相关文章

  1. javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  2. js | javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  3. vue获取dom元素高度的方法

    获取高度: <div ref="自定义名称" > </div>要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作!!! mo ...

  4. 如何在onCreate中获取View的高度和宽度

    如何在onCreate中获取View的高度和宽度 原文链接:http://mp.weixin.qq.com/s?__biz=MzAwODE1NTI2MQ==&mid=2247483676&am ...

  5. Android 在OnCreate()中获取控件高度与宽度

    试过在OnCreate()中获取控件高度与宽度的童鞋都知道,getWidth()与getHeight()方法返回是0,具体原因 看一下Activity的生命周期 就会明白. 上代码: 方法一: int ...

  6. JavaScript中获取HTML元素的方式

    JavaScript中获取HTML元素的方式 1.使用id方式获取元素,返回一个具体对象   document.getElementById(id名) 2.使用className方式获取元素,返回类数 ...

  7. 20.Vue中获取DOM元素和组件

    1.获取DOM元素和组件:this.$refs

  8. web开发中获取的各种高度和宽度

    前端开发中经常需要获取页面还有屏幕的高度和宽度进行计算,此文即介绍如何用 JavaScript 还有 jQuery 获取这些尺寸. 1.简介 一个页面显示在浏览器内,浏览器又放置在屏幕窗口内,所以由里 ...

  9. Vue中获取dom元素

    Vue.js虽然说是数据驱动页面的,但是有时候我们也要获取dom对象进行一些操作. vue的不同版本获取dom对象的方法不一样 Vue.js  1.0版本中,通过v-el绑定,然后通过this.els ...

随机推荐

  1. Ubuntu16.04(Linux)安装JDK

    Ubuntu 安装JDK的两种方式: 1:通过ppa(源) 方式安装. 2:通过官网下载安装包安装. 第1种,因为可以通过 apt-get upgrade 方式方便获得jdk的升级 第一种:使用ppa ...

  2. eslint规则记录

    "off"或者0 //关闭规则关闭 "warn"或者1 //在打开的规则作为警告(不影响退出代码) "error"或者2 //把规则作为一个 ...

  3. 关于 img 父容器比img图片要多4个像素的问题

    问题背景: <div> <img src="" /> </div> 图片和div 的宽度相同,div的高度等于图片的高度 结果发现div的高度 ...

  4. GoJs实现流程管理图

    GoJS是一个实现交互类图表(比如流程图,树图,关系图,力导图等等)的JS库. 可以加入诸多功能.如流程判断,节点处理等等.GOJS在设计上极大的减轻了开发人员的开发成本.

  5. IoT Gateway Based on OSGi

    1. OSGi Knowleage 2. OSGi.Net on Windows 3. OSGi with JAVA 4. OSGi with Qt and C++ 5. Architecture o ...

  6. 常用到的简单命令 Sublime Git NPM WindowsCMD MacTerminal(Unix命令) Vim

    sublime 选择标签及其内容 ctrl+shift+a连续按两次 调出Package console: Mac: command + shift + p 安装插件: 1.调出 Package co ...

  7. SVG坐标系统和transformation彻底理解

    翻译自https://sarasoueidan.com/blog/svg-coordinate-systems/ SVG元素不像传统的HTML elements一样受制于css box model.这 ...

  8. sql 2000 无法连接远程数据库 sqlserver不存在或访问被拒绝、不能打开到主机的连接，在端口1433：连接失败等 解决方案

    问题: sql 2000 无法连接远程数据库 sqlserver不存在或访问被拒绝 telnet 127.0.0.1 1433     提示:不能打开到主机的连接,在端口1433:连接失败 解决方案: ...

  9. Mybatis学习---基础知识考核

    MyBatis 2.什么是MyBatis的接口绑定,有什么好处 接口映射就是在IBatis中任意定义接口,然后把接口里面的方法和SQL语句绑定,    我们直接调用接口方法就可以,这样比起原来了Sql ...

  10. 沉淀再出发：关于java中的AQS理解

    沉淀再出发:关于java中的AQS理解 一.前言 在java中有很多锁结构都继承自AQS(AbstractQueuedSynchronizer)这个抽象类如果我们仔细了解可以发现AQS的作用是非常大的 ...