[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") 其 ...
随机推荐
- Python 文件操作模块 shutil 详解
1.导入模块 shutil import shutil 2.shutil方法 2.1 shutil.copy(src,dst) //将 src 复制到 dst 保留文件权限 例:将Alan复制到 ...
- transition和animation动画简介
本文介绍CSS动画的两大组成部分:transition和animation.我不打算给出每一条属性的详尽介绍,那样可以写一本书.这篇文章只是一个简介,帮助初学者了解全貌,同时又是一个快速指南,当你想不 ...
- InvoiceCancelSendApAction
package nc.ui.pu.m25.action; import java.awt.event.ActionEvent; import nc.bs.framework.common.NCLoca ...
- ASP.Net Core 运行在Linux(Ubuntu)
这段时间一直在研究asp.net core部署到linux,今天终于成功了,这里分享一下我的部署过程. Linux Disibutaion:Ubuntu 14.04 Web Server:nginx. ...
- freemarker.core.InvalidReferenceException: Expression stackObject.value.get(propertyName).toString() is undefined
很奇怪的报错, 在实体中添加 toString方法后, 想在前台列表中使用 <s:debug标签调试, 发现报错如下: freemarker.core.InvalidReferenceExcep ...
- ASP.NET MVC模型绑定的6个建议(转载)
ASP.NET MVC模型绑定的6个建议 发表于2011-08-03 10:25| 来源博客园| 31 条评论| 作者冠军 validationasp.netmvc.netasp 摘要:ASP.NET ...
- ###《Effective STL》--Chapter1
点击查看Evernote原文. #@author: gr #@date: 2014-09-12 #@email: forgerui@gmail.com Chapter1 容器 Topic 4: 调用e ...
- JavaScript学习笔记(4)——JavaScript语法之变量
一.变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume). 变量必须以字母开头 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做 ...
- GDI+中发生一般性错误之文件被占用
有多种原因可能导致这个异常出现,比如创建文件的权限不足.文件被占用等. 这里提供一个使用Stream读取图片避免文件被占用的方法. public Image GetImageFromStream(st ...
- OC6_字符串练习
// // QFString.h // OC6_字符串练习 // // Created by zhangxueming on 15/6/10. // Copyright (c) 2015年 zhang ...