元素未显示设置width/height时IE中使用currentStyle获取为auto


Posted in Javascript onMay 04, 2014

我们知道获取元素的实际宽高在IE中可以使用currentStyle属性。但如果没有显示的去设置元素的宽高,那么使用该属性将获取不到,获取的值为auto。如下

<div>abcd</div> 
<script> 
var div = document.getElementsByTagName('div')[0]; 
alert(div.currentStyle.width); 
alert(div.currentStyle.height); 
</script>

IE6/7/8/9中输出的都是auto。如果显示的设置了宽高,那么输出的就是实际宽高。如下

1,通过内联style属性设置

<div style="width:100px;height:50px;">abcd</div> 
<script> 
var div = document.getElementsByTagName('div')[0]; 
alert(div.currentStyle.width); 
alert(div.currentStyle.height); 
</script>

2,通过页面嵌入style标签设置
<style> 
div { 
width: 100px; 
height: 50px; 
} 
</style> 
<div>abcd</div> 
<script> 
var div = document.getElementsByTagName('div')[0]; 
alert(div.currentStyle.width); 
alert(div.currentStyle.height); 
</script>

都将输出:100px,50px
Javascript 相关文章推荐
encode脚本和normal脚本混用的问题与解决方法
Mar 08 Javascript
javascript 节点遍历函数
Mar 28 Javascript
解决jquery插件冲突的问题
Jan 23 Javascript
javascript中bind函数的作用实例介绍
Sep 28 Javascript
javascript实现分栏显示小技巧附图
Oct 13 Javascript
7个有用的jQuery代码片段分享
May 19 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
May 04 Javascript
Vue框架之goods组件开发详解
Jan 25 Javascript
vue+iview+less 实现换肤功能
Aug 17 Javascript
JS多个异步请求 按顺序执行next实现解析
Sep 16 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
Sep 18 Javascript
理解JavaScript中的Proxy 与 Reflection API
Sep 21 Javascript
JavaScript获取图片的原始尺寸以宽度为例
May 04 #Javascript
使用JavaScript判断图片是否加载完成的三种实现方式
May 04 #Javascript
使用JavaScript获取电池状态的方法
May 03 #Javascript
JavaScript打印网页指定区域的例子
May 03 #Javascript
js检测输入内容全为空格的方法
May 03 #Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
May 03 #Javascript
离开当前页面前使用js判断条件提示是否要离开页面
May 02 #Javascript
You might like
3种平台下安装php4经验点滴
2006/10/09 PHP
PHP isset()与empty()的使用区别详解
2017/02/10 PHP
PHP PDOStatement::fetchColumn讲解
2019/01/31 PHP
JavaScript 设计模式 富有表现力的Javascript(一)
2010/05/26 Javascript
DOM基础教程之使用DOM设置文本框
2015/01/20 Javascript
JavaScript实现将UPC转换成ISBN的方法
2015/05/26 Javascript
jQuery实现的图文高亮滚动切换特效实例
2015/08/10 Javascript
jQuery操作动态生成的内容的方法
2016/05/28 Javascript
jQuery实现的模拟弹出窗口功能示例
2016/11/24 Javascript
JS中setTimeout和setInterval的最大延时值详解
2017/02/13 Javascript
Vuex和前端缓存的整合策略详解
2017/05/09 Javascript
Vue如何实现组件的源码解析
2017/06/08 Javascript
详解webpack4之splitchunksPlugin代码包分拆
2018/12/04 Javascript
微信网页登录逻辑与实现方法
2019/04/29 Javascript
layui将table转化表单显示的方法(即table.render转为表单展示)
2019/09/24 Javascript
微信小程序实现点击按钮后修改颜色
2019/12/05 Javascript
使用cx_freeze把python打包exe示例
2014/01/24 Python
Python读取指定目录下指定后缀文件并保存为docx
2017/04/23 Python
Python基于动态规划算法解决01背包问题实例
2017/12/06 Python
Python 获取中文字拼音首个字母的方法
2018/11/28 Python
学习python可以干什么
2019/02/26 Python
Pytorch 之修改Tensor部分值方式
2019/12/27 Python
Python爬取新型冠状病毒“谣言”新闻进行数据分析
2020/02/16 Python
python实现录屏功能(亲测好用)
2020/03/02 Python
容易被忽略的Python内置类型
2020/09/03 Python
python二维图制作的实例代码
2020/12/03 Python
CSS3+js实现简单的时钟特效
2015/03/18 HTML / CSS
美国在线乐器和设备商店:Musician’s Friend
2018/07/06 全球购物
大学校庆策划书
2014/01/31 职场文书
群众路线教育党课主持词
2014/04/01 职场文书
个人担保书格式范文
2014/05/12 职场文书
2014应届本科生自我评价
2014/09/13 职场文书
师德先进个人事迹材料
2014/12/19 职场文书
酒店温馨提示语
2015/07/14 职场文书
2016年优秀班主任先进事迹材料
2016/02/26 职场文书
微信小程序中使用vant框架的具体步骤
2022/02/18 Javascript