元素未显示设置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 相关文章推荐
formValidator3.3的ajaxValidator一些异常分析
Jul 12 Javascript
jQuery实现鼠标滑过点击事件音效试听
Aug 31 Javascript
快速移动鼠标触发问题及解决方法(ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave)
Aug 29 Javascript
JQuery统计input和textarea文字输入数量(代码分享)
Dec 29 Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 Javascript
vue.js从安装到搭建过程详解
Mar 17 Javascript
AngularJS+bootstrap实现动态选择商品功能示例
May 17 Javascript
js断点调试经验分享
Dec 08 Javascript
微信小程序之分享页面如何返回首页的示例
Mar 28 Javascript
vue实现购物车列表
Jun 30 Javascript
解决vue-photo-preview 异步图片放大失效的问题
Jul 29 Javascript
vue表单验证之禁止input输入框输入空格
Dec 03 Vue.js
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
dedecms 制作模板中使用的全局标记图文教程
2007/03/11 PHP
ThinkPHP中关联查询实例
2014/12/02 PHP
PHP模拟登陆163邮箱发邮件及获取通讯录列表的方法
2015/03/07 PHP
PHP curl伪造IP地址和header信息代码实例
2015/04/27 PHP
php生成固定长度纯数字编码的方法
2015/07/09 PHP
PHP读MYSQL中文乱码的快速解决方法
2016/10/01 PHP
[IE&amp;FireFox兼容]JS对select操作
2007/01/07 Javascript
javascript 写类方式之七
2009/07/05 Javascript
JS类的封装及实现代码
2009/12/02 Javascript
客户端 使用XML DOM加载json数据的方法
2010/09/28 Javascript
Jquery常用技巧收集整理篇
2010/11/14 Javascript
JavaScript通过this变量快速找出用户选中radio按钮的方法
2015/03/23 Javascript
AngularJs bootstrap搭载前台框架——基础页面
2016/09/01 Javascript
JS获取鼠标坐标并且根据鼠标位置不同弹出不同内容
2017/06/12 Javascript
[07:09]2014DOTA2国际邀请赛-Newbee再次发威成功晋级决赛
2014/07/19 DOTA
[32:47]完美世界DOTA2联赛 GXR vs IO 第二场 11.07
2020/11/09 DOTA
跟老齐学Python之玩转字符串(2)
2014/09/14 Python
Python版微信红包分配算法
2015/05/04 Python
python+pygame简单画板实现代码实例
2017/12/13 Python
Python向MySQL批量插数据的实例讲解
2018/03/31 Python
浅析python 中大括号中括号小括号的区分
2019/07/29 Python
Python 2种方法求某个范围内的所有素数(质数)
2020/01/31 Python
使用python创建Excel工作簿及工作表过程图解
2020/05/27 Python
Python连接Mysql进行增删改查的示例代码
2020/08/03 Python
生产副总岗位职责
2013/11/28 职场文书
迟到检讨书800字
2014/01/13 职场文书
工厂门卫岗位职责范本
2014/04/04 职场文书
入党介绍人评语
2014/05/06 职场文书
社区党建工作汇报材料
2014/10/27 职场文书
周恩来的四个昼夜观后感
2015/06/03 职场文书
感谢信的技巧及范例
2019/05/15 职场文书
PySwarms(Python粒子群优化工具包)的使用:GlobalBestPSO例子解析
2021/04/05 Python
Ajax实现三级联动效果
2021/10/05 Javascript
Python集合的基础操作
2021/11/01 Python
Win11 Build 22000.51版本文件资源管理器“命令栏”和上下文菜单有什么新变化?
2021/11/21 数码科技
MySQL库表太大怎么办? 数据库分库分表项目实践
2022/04/11 MySQL