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. js | javascript中获取dom元素的高度和宽度

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

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

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

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

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

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

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

  5. Vue中获取dom元素

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

  6. JavaScript中获取html元素常用手法和区分

    对于许多前端开发项目来说,获取元素进行操作是必不可少的,例如tab标签,全屏切换,自动滚播等效果都需要通过获取节点元素来实现.下面我来总结下JavaScript最常用的4个Document对象中获取元 ...

  7. Vue自定义指令获取DOM元素

    我们知道,Vue.js的核心是数据驱动,当数据有所变化时,DOM就会被更新,比如: <span v-text="msg"></span> export de ...

  8. JavaScript获取DOM元素位置和尺寸大小

      在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果,这种时候我们经常会用到一些元素位置和尺寸的计算,浏览器兼容性问题也是不可忽略的一部分,要想写出预想效果的JavaScri ...

  9. angular学习笔记-angular中怎么获取dom元素

    步骤分解: 第一步:给要获取的元素一个ng-model变量,并且绑定事件啦! <div class="home" ng-model="dirName" n ...

随机推荐

  1. Asp.Net Boilerplate Project (ABP) 视频教程

    转自youtube:https://www.youtube.com/playlist?list=PLlu_PkRHZce-EtuVO1zVQpNgrB7Hiu1vu 虽然全部都没有声音,但看操作还是可 ...

  2. Spark2.1.0官方文档

    Spark 概述 Apache Spark是一个快速和通用的集群计算系统.它提供Java,scala,Python.R语言的APIs,以及支持一般执行图形的优化引擎. 它还支持一组丰富的高级工具,包括 ...

  3. 【python学习笔记】6.抽象

    [python学习笔记]6.抽象 创建函数: 使用def语句定义函数,不用声明参数类型,和返回值类型 def function_name(param1, param2): 'this is docum ...

  4. node.js 模块化

    模块是编写稍大一点点的程序 一般就会将代码模块化 在node.js中每一个文件就是一个模块,而文件路径就是模块名 怎么使用模块? 在编写某个模块是都有三个预先定义(require,exports,mo ...

  5. 数据库操作sql

    一.把从另外一张表里查到的值插入到前表: 1. 表结构完全一样 insert into 表1 select * from 表2 2. 表结构不一样(这种情况下得指定列名) insert into 表1 ...

  6. Maven-09: 在线插件信息

    仅仅理解如何配置使用插件是不够的.当遇到一个构建任务的时候,用户还需要知道去哪里寻找合适的插件,以帮助完成任务.找到正确的插件之后,还要详细了解该插件的配置点.由于Maven的插件非常多,而且这其中的 ...

  7. poj-1131-（大数）八进制转化成十进制

    Description Fractions in octal (base 8) notation can be expressed exactly in decimal notation. For e ...

  8. Hibernate学习（2）- hibernate.cfg.xml详解

    1:主配置文件主要分为三部分: 注意:通常情况下,一个session-factory节点代表一个数据库: 1.1:第一部分 数据库连接部分,注意"hibernate.connection.d ...

  9. python实现的txt目录树

    首先,我先表述一下我的需求: 我记笔记比较乱,但我比较容易"半途而废".文件夹很多,但大都只有一两个文件.... 所以我需要一种方式,能在不逐个打开文件夹的前提下,"看到 ...

  10. IE11,Chrome65.0.3325.146,Firefox58的webdriver驱动下载，并用selenium驱动来实现自动化测试

    各浏览器版本:    python版本: selenium版本: IE11的Webdriver下载: http://dl.pconline.com.cn/download/771640-1.html ...