第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通

过#div1.style.width拿不到宽度，而通过#div1.offsetWidth才可以获取到宽度。

第二种情况就是宽和高是写在行内中，比如，这中情况通过

上述2个方法都能拿到宽度。

小结，因为id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内，所以

我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的

属性都不能通过id.style.atrr来获取。

现 在的前端制作很少直接把样式写style里了，都是写在样式表里。如果你要获取

的样式没有相对应的（就像#div1.style.width对 应#div1.offsetWidth），就只

能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属

性”之类的。

var o = document.getElementById("view");

var h = o.offsetHeight;  //高度

var w = o.offsetWidth;  //宽度

[JavaScript] js获取Html元素的实际宽度高度的更多相关文章

  1. js获取Html元素的实际宽度高度

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

  2. 原生js获取Html元素的实际宽度高度

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

  3. javascript js获取html元素各种距离方法

    //滚动条 scrollLeft//滚动条距左边距离 scrollTop//滚动条距顶部距离 scrollWidth//滚动条元素的宽 scrollHeight//滚动条元素的高 //可视范围 cli ...

  4. js获取浏览器body或窗宽度高度合集

    <script type="text/javascript"> var s = " "; document.documentElement.scro ...

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

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

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

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

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

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

  8. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

  9. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

随机推荐

  1. 关于Apache Commons-Lang的总结

    部分转载至:http://linhongyu.blog.51cto.com/6373370/1553329 一.前言 Java码农不识Apache,敲尽一生也枉然.旗下的开源项目众多,各个都是吊炸天. ...

  2. Python(2.7.6) 函数对象与闭包

    在 Python 中,一切皆对象.函数也是对象,它可以赋值给其他变量,也可以当作参数传递. lambda 表达式可以创建函数对象,在 Python 中,lambda 表达式的函数体只能有唯一的一条语句 ...

  3. lookup：ID列

    对lookup列对应的ID列的引用的写法 if (item["NavType_x003a_ID"].ToString() == type["ID"].ToStr ...

  4. sql 复习

    创建表 #设置外键 create table example3(id int primary key, stu_id int, course_id int, constraint c_fk forei ...

  5. anyConnect连接VPN后无法上网

    最近想使用学校图书馆的VPN, 使用的是anyConnect的客户端.每次连接后都显示连接成功,但是马上就无法上网了. 开始以为是win10系统不兼容的问题,在虚拟机里面用win7测试可以成功,但是因 ...

  6. ASP.NET生成日历

    public string GetDayList(DateTime? date) { ; var minDate = Convert.ToDateTime(((DateTime)(date ?? Da ...

  7. 第五篇、HTML标签类型

    <!--1.块级标签 独占一行,可以设置高度和宽度 如:div p h ul li  -----display: none(隐藏标签) block(让行内标签变块级标签) inline(让块级标 ...

  8. iOS 键盘回收实现步骤

    第一步:遵守协议 (UITextFieldDelegate) @interface AppDelegate : UIResponder <UIApplicationDelegate,UIText ...

  9. mac配置svn服务器

    1创建svn库:mudydeMacBook-Air:~ mudy$   svnadmin create /Users/mudy/svn   2进行配置,配置我们的svn a.将svnsever.con ...

  10. 在centos7中限制kvm虚拟机可访问的资源

    最近通过艰苦卓绝的度娘(我很想用谷歌,可是,你懂的),终于搞明白如何在centos7中限制kvm虚拟机可访问的资源了.度娘给出的结果中,大部分都说的很对,然而,却很难照着做,主要原因有两点:1.网上的 ...