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. centos7 安装配置zookeeper

    https://blog.csdn.net/AaronLin6/article/details/78438877 https://www.cnblogs.com/sxdcgaq8080/p/74924 ...

  2. 谈谈Windows Wow64

    欢迎转载,转载请注明出处:http://www.cnblogs.com/lanrenxinxin/p/4977488.html 本文是<深入理解Windows操作系统 (第六版) >关于6 ...

  3. CRM项目hellokitty部分交互界面

    登录界面 实现密码的不显示,验证码的跟换 员工管理界面  完成所有的功能 学校统计界面 完成所有的功能 班级管理 差一个手风琴组件 其他功能也完成了

  4. WEB开发框架性能排行与趋势分析

    WEB开发框架性能基准测试解读与趋势分析 TechEmpower的<Web Framework Benchmarks>性能基准测试,是关注Web开发框架发展的重要途径.但是内容数据众多,每 ...

  5. ZOJ Problem Set - 3878 Convert QWERTY to Dvorak

    题目链接: http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3878 /* 问题 很有意思的一道题目,纯模拟,注意细节和最后一 ...

  6. 中小型研发团队架构实践六：如何用好消息队列RabbitMQ？

    一.写在前面 使用过分布式中间件的人都知道,程序员使用起来并不复杂,常用的客户端 API 就那么几个,比我们日常编写程序时用到的 API 要少得多.但是分布式中间件在中小研发团队中使用得并不多,为什么 ...

  7. windows下nodejs监听80端口

    windows下nodejs监听80端口时提示端口被占用报错,解决方案如下: 1.cmd---netstat -ano查看是什么程序占用了80端口: 2.控制面板--管理工具--服务--停止 SQL ...

  8. 【ibatis】入门讲例

    Ⅰ .Ibatis项目机构 打开资源包,可以看到里面有一个simple_exzample的文件夹,在MyEclipse8.5中新建一个JAVA项目,将刚才的文件夹中内容复制到项目SRC下,这样的话呢, ...

  9. Saving HDU（hdu2111，贪心）

    Saving HDU Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total ...

  10. 小希的迷宫（hdu1272）并查集（有点坑）

    纪念我死去的脑细胞们    .....   小希的迷宫 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java ...