js无法获取未设置样式的input的宽高

来源：互联网发布：java做的购物车代码编辑：程序博客网时间：2024/06/01 08:55

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript">function show(e) {var _event = e ? e : window.event;var _type = _event.type;var _target = _event.srcElement ? _event.srcElement : _event.target;var target_width = _target.style.width;var target_height = _target.style.height;alert('target_width:' + target_width + '---target_height:' + target_height);}</script></head><body><input type="text" name="" onclick="show(event);" /></body></html>

以上是我的demo。

alert出来的结果是

target_width:---target_height:

表示宽高皆为''（空）。

本人是通过为空时，手动设置宽高。

input标签在type为text时，在Firefox和Safari中的默认高度为22像素（包括上下边框）宽度为146像素（包括左右边框），而在IE中的默认高度为24像素，而宽度却和Firefox和Safari是一致的，也是146像素。

关于‘input标签默认样式的差别及其跨浏览器设计’详情在http://fengershao.blog.163.com/blog/static/19849005420122300125043/

不晓得此现象是何原因。希望大侠们可以分享自己的经验。