[JavaScript] js获取Html元素的实际宽度高度
第一种情况就是宽高都写在样式表里,就比如#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元素的实际宽度高度的更多相关文章
- js获取Html元素的实际宽度高度
第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. 第 ...
- 原生js获取Html元素的实际宽度高度
第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. 第 ...
- javascript js获取html元素各种距离方法
//滚动条 scrollLeft//滚动条距左边距离 scrollTop//滚动条距顶部距离 scrollWidth//滚动条元素的宽 scrollHeight//滚动条元素的高 //可视范围 cli ...
- js获取浏览器body或窗宽度高度合集
<script type="text/javascript"> var s = " "; document.documentElement.scro ...
- js | javascript中获取dom元素的高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- javascript中获取dom元素的高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- javascript中获取dom元素高度和宽度
javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...
- js获取隐藏元素宽高的方法
网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...
- JS1 js获取dom元素方法
js获取dom元素方法 1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId") 其 ...
随机推荐
- ppss
parallel processing shell script Oct 19 Q: how to schedule multi-cpus on each event?
- 关于windows中的任务管理调度器
windows中的任务管理调度器 任务管理调度器大概就是给windows设置一个任务,同时还可以设置这个任务的执行时间,执行次数等. 这个任务管理调度器是公司培训同事在讲studio中的job可以在s ...
- mongodb使用mongoose分组查询
一个分组查询的例子: model.aggregate([{$match: ops}, {$unwind: '$details'}, {$sort: {create_at: -1}}, { $group ...
- 第十三篇、jQuery Mobile
API-->搜索data 0.page data-transition="slide" // 页面切换效果 data-position="fixed" / ...
- iOS开发——https+证书
由于公司项目的需要,经过调研后,已成功. 同事已把此问题写成博客<[加密解密]HTTPS>,我就直接转用了 附带链接如下: http://www.jianshu.com/p/8351917 ...
- C#变量初始化问题:字段初始值无法引用非静态字段、方法或属性
http://www.cnblogs.com/bluestorm/p/3432190.html 问题:字段初始值设定项无法引用非静态字段.方法或属性的问题 下面代码出错的原因,在类中定义的字段为什么不 ...
- CSS3的几个标签速记3
transition:CSS3过渡 css3里很好的一个标签,可以非常方便的完成需要很多JS才能完成的动态效果 例语法:transition:width 2S,height 2S,transf ...
- Windows下lex 与 yacc的使用(2)
Windows下lex 与 yacc的使用 ...
- java异常处理练习
异常的练习: 老师用电脑上课. 开始思考上课中出现的问题. 比如问题是 电脑蓝屏. 电脑冒烟. 要对问题进行描述,封装成对象. 可是当冒烟发生后,出现讲课进度无法继续. 出现了讲师的问题: ...
- Unix/Linux之命令备忘录
ps:是显示瞬间进程的状态,并不动态连续 kill:用于杀死进程或者给进程发送信号 // 在Linux下查看所有java进程命令 ps -ef | grep java: // 停止所有java进程命 ...