js获取Html元素的实际宽度高度的方法

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

第二种情况就是宽和高是写在行内中，比如style="width:120px;"，这中情况通过上述2个方法都能拿到宽度。

小结，因为id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过id.style.atrr来获取。

现 在的前端制作很少直接把样式写style里了，都是写在样式表里。如果你要获取的样式没有相对应的（就像#div1.style.width对 应#div1.offsetWidth），就只能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属性”之类的。

代码：

1 2 3

var o = document.getElementById("view"); var h = o.offsetHeight; //高度 var w = o.offsetWidth; //宽度

以上这篇js获取Html元素的实际宽度高度的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持IT工厂。

原文地址：http://www.link588.com/html/wangluobiancheng/138524.html

推荐阅读:

• js多功能分页组件layPage使用方法详解
• 深入理解MVC中的时间js格式化
• Node.js+Express配置入门教程详解
• 基于jQuery的Web上传插件Uploadify使用示例
• 前端js文件合并的三种方式推荐
• Node.js+Express配置入门教程
• 判断数组是否包含某个元素的js函数实现方法
• JavaScript中的ParseInt("08")和“09”返回0的原因分析及解决办法
• javascript中JSON.parse()与eval()解析json的区别
• js获取隐藏元素宽高的实现方法
• AngularJs解决跨域问题案例详解(简单方法)
• JS Attribute属性操作详解
• Bootstrap教程JS插件滚动监听学习笔记分享
• Node.js刷新session过期时间的实现方法推荐
• JS+Canvas 实现下雨下雪效果
• jquery遍历json对象集合详解
• js验证框架实现代码分享
• Node.js返回JSONP详解
• Jquery跨域获得Json的简单实例
• Bootstrap教程JS插件弹出框学习笔记分享

转载于:https://my.oschina.net/suyuwen/blog/684708