前一段时间看到了这样的代码
css
.s {
width: 200px;
height: 200px;
background: red;
}
html
<button id="btn">获取</button>
<div id="ss" class="s"></div>
js
window.onload = function() {
var btn = document.getElementById("btn");
var ss= document.getElementById("ss");
btn.onclick = function() {
console.log(ss.style.width);
}
}
光看代码其实看不出有什么错误，但是是获取不到width的值的！！！
因为通过style只能获取内联样式，如
<div id="ss" class="s" style="width: 100px"></div>
注意不要写成这样
<div id="ss" class="s" width="100px"></div>
其实获取元素的宽和高可以使用getBoundingClientRect或offsetWidth/offsetHeight
具体代码就不贴了，只要注意获取的并不是类似于style的width，而是包括padding以及边框，演示地址http://jsrun.net/JkiKp/edit
