JS获取元素宽高分两种情况，

一、内联样式，也就是直接把width和height写在HTML元素中的style里：

　　这种情况使用     document.getElementById('xxx').style.width即可获取宽度（高度同理）

二、写在CSS样式表中，这种情况使用 document.getElementById('xxx').style.width是获取不到的

　　应使用 document.getElementById('xxx').currentStyle.width 来获取

JS获取元素宽高的两种情况的更多相关文章

  1. 原生JS获取元素宽高实践详解

    开篇的话 任何不是亲身实践中求得的知识,都不是属于你的.任何求得的知识不去时常温习运用,也不是属于你的. 记录由来 在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才排 ...

  2. js 获取元素宽高

    可以用源生js的.offsetHeight .offsetWidth属性 document.getElementById("temp_form").offsetHeight // ...

  3. js获取元素宽高、位置相关知识汇总

    常见clientWidth.clientHeight.offsetWidth.offsetLeft,clientX.scrollTop等词语,比较混乱,现在总结下他们的区别. 1. clientWid ...

  4. js 获取元素宽

    第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. 第 ...

  5. 滚动加载图片（懒加载）实现原理（这是旧实现，仅做为获取元素宽高api的参考）

    https://www.cnblogs.com/flyromance/p/5042187.html 本文主要通过以下几方面来说明懒加载技术的原理,个人前端小菜,有错误请多多指出 一.什么是图片滚动加载 ...

  6. JS获取网页宽高方法集合

    JS获取网页宽高等方法的集合:document.body.clientWidth - 网页可见区域宽document.body.clientHeight - 网页可见区域高 document.body ...

  7. Activity启动过程中获取组件宽高的五种方式

    第一种:(重写Activity的onWindowFocusChanged方法) /** * 重写Acitivty的onWindowFocusChanged方法 */ @Override public ...

  8. 微信小程序之动态获取元素宽高

    我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuery() 这个api接口,以前的某些问题就能得到解决了... 那么,这个api接口怎么用 ...

  9. js获取各种宽高方法

    屏幕的有效宽高: window.screen.availHeightwindow.screen.availWidth 网页可见区域宽:document.body.clientWidth 网页可见区域高 ...

随机推荐

  1. Python爬取简书主页信息

    主要学习如何通过抓包工具分析简书的Ajax加载,有时间再写一个Multithread proxy spider提升效率. 1. 关键点: 使用单线程爬取,未登录,爬取简书主页Ajax加载的内容.主要有 ...

  2. Chapter 3 Phenomenon——19

    His unfriendliness intimidated me. 他的不友好恐吓到了我. My words came out with less severity than I'd intende ...

  3. 第三方登录：微信扫码登录（OAuth2.0）

    1.OAuth2.0 OAuth(开放授权)是一个开放标准,允许用户让第三方应用访问该用户在某一网站上存储的私密的资源(如照片,视频,联系人列表),而无需将用户名和密码提供给第三方应用. 允许用户提供 ...

  4. 非Spring环境下使用Mybatis操作数据库的流程

    准备工作 1,  导入mybatis-3.2.7.jar,mysql-connector-5.1.25-bin.jar两个jar包 2,  在数据库中创建一个db_test数据库,库中有一个表为use ...

  5. 第六章 对象作用域与servlet事件监听器

          作用域对象 Servlet上下文监听器 Servlet会话监听器 Servlet请求监听器     一:对象作用域 作用域对象 属性操作方法 作用域范围说明 ServletContext( ...

  6. confluence输入数学公式之mathjax

    1.概述 公司大数据业务需求,需要一些计算公式写入到confluence里面,并且可能会不断修改,如果上传图片的话修改起来不是很方便.于是google了一把,发现收费的有Latex Math下载量还是 ...

  7. Java设计模式学习记录-适配器模式

    前言 之前已经将五个创建型设计模式介绍完了,从这一篇开始介绍结构型设计模式,适配器模式就是结构型模式的一种,适配器要实现的效果是把“源”过渡到“目标”. 适配器模式 在开发过程中,使用一个已经存在的类 ...

  8. winform窗体 控件【菜单和工具栏控件】【容器控件】

    winform的菜单栏和工具栏    1.ContextMenuStrip   -- 右键菜单     可以绑定在任何一个控件上,添加操作快捷键,并可以设置多层    每行相当于一个按钮,输入-可添加 ...

  9. abp运行机制分析

    abp运行流程 由于公司现在大量向abp框架+react前后端分离架构转型,所以有必要分析abp框架是如何在iis运行的,所以才有这篇文章 public class MvcApplication : ...

  10. [小技巧]Filezilla无法确定拖放操作目标,由于shell未正确安装__解决办法

    重装系统及相关软件之后,用filezilla拖拽ftp上的文件到桌面的时候,提示"无法确定拖放操作目标......" 解决办法很简单,执行如下几步就OK了 ①在CMD中,进入Fil ...