以前一直用jquery的.width()方法來獲取一個元素的當前的寬度。不管該元素是否設置了寬度，CSS樣式是內聯、外聯or內嵌，都可用此方式獲得元素當前的寬度。
今天想用原生JS想獲取一個元素寬度時，寫document.getElementById("id").style.width或者document.getElementById("id").width都取不到值。。。
總結了一下。在以下情況下，js原生.style.width或者.width取不到值
1.元素未設置寬度值。
2.元素設置了寬度值，但，設置在內聯或外聯樣式表中，而非內嵌式的。比如
css代碼
p{
background:pink;
}
html代碼
<p id="p1">aaaaaaaaaa</p>
PS：雖然這種方式取不到寬度值。但卻可以設置元素的寬度值。比如：設置p元素寬度為200px:
document.getElementById("p1").style.width ="200px";
綜上，所以，只有將元素的樣式設置成內嵌式的，才可以通過 document.getElementById("id").style.width 來獲取寬度值；
比如：
<p id="p1" style="width:144px;">dddddddddd</p>
執行js代碼
var w = document.getElementById("p1").style.width;
alert(w);
執行后輸出結果為144px
那么，對於沒有設置寬度的元素、亦或CSS樣式非內嵌式的，js原生寫法可以通過offsetWidht來獲取寬度
即：document.getElementById("#p1").offsetWidth;
ps:對於設置了CSS樣式的元素（內聯、內嵌、外聯）offsetWidth 也都可以獲得值
所以，jquery的width()與js的offsetWidth都可以獲取元素的寬度，但有個區別：
.width()的值單純是內容區域的寬度、不包括內外補丁和border。ie6+和chrome相同。
offsetWidth ：包括了內補丁和border，不包括外補丁。ie6+和chrome相同