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. 基于.Net下整合FastReport,实现条码标签批量打印

    一. 准备工作 1. 点击此下载支持.Net4.0的 FastReport ,安装后并破解 2. VS2012 工具箱中,新建选项卡,添加 %安装目录%\Framework 4.0\FastRepor ...

  2. Java 并发:线程中断-interrupt

    一直以为执行了interrupt方法就可以让线程结束,并抛出InterruptedException. 今天看了Java并发编程实战的第七章发现并不是这么回事,在这章的开头就提到 要使任务和线程能安全 ...

  3. Effective C++ .47 traits与模板特化

    #include <iostream> #include <cstdlib> #include <string> using namespace std; temp ...

  4. 13 Reasons Why You Should Pay Attention to Mobile Web Performance

    Mobile is no longer on the sidelines. If you’re not already thinking mobile first, you should at lea ...

  5. 使用WICleanup清理Windows Installer 冗余文件

    使用WICleanup清理Windows Installer 冗余文件 | 浏览:816 | 更新:2015-11-02 10:43 | 标签:Win7 Win10 1 2 3 4 5 6 7 分步阅 ...

  6. 编辑文本(EditText)

    今天要给大家介绍的是简单的编辑文本框: 先看一下它的基本属性: 1.Activity public class EditTextActivity extends Activity { private ...

  7. ZABBIX 2.1.0 发布,分布式系统监控

    ZABBIX 2.1.0 发布了,这相当是 ZABBIX 2.2 的首个 Alpha 版本,包括了新的主要的功能和改进. 主要包括如下几个方面的提升: 性能提升 可加载模块 移除对未知事件的支持 应用 ...

  8. flask请求流程

  9. AndroidUI多线程网络请求更新导致BUG

    昨天发现一个问题,以前做好的UI列表不用正常显示了,必须,下拉一下,才能加载内容,以前是页面自动加载第一屏幕的. 这个就不好了,只是给页面加了一个按钮啊,不应该造成这么大的问题. 按钮就是设置了一个位 ...

  10. C# 装箱和拆箱[整理](转)

    //1. // 装箱和拆箱是一个抽象的概念 //2. // 装箱是将值类型转换为引用类型 :拆箱是将引用类型转换为值类型 // 利用装箱和拆箱功能,可通过允许值类型的任何值与Object 类型的值相互 ...