jquery 與javascript 獲取元素尺寸大小的對比

jquery獲取尺寸的方法 width() 方法設置或返回元素的寬度（不包括內邊距、邊框或外邊距）。 height() 方法設置或返回元素的高度（不包括內邊距、邊框或外邊距）。

innerWidth() 方法返回元素的寬度（包括內邊距）。 innerHeight() 方法返回元素的高度（包括內邊距）。

outerWidth() 方法返回元素的寬度（包括內邊距和邊框）。 outerHeight() 方法返回元素的高度（包括內邊距和邊框）。

js獲取尺寸的方法 clientWidth 是對象可見的寬度，不包滾動條等邊線，會隨窗口的顯示大小改變。
offsetWidth 是對象的可見寬度，包滾動條等邊線，會隨窗口的顯示大小改變。

Window 尺寸 有三種方法可以肯定瀏覽器窗口的尺寸（瀏覽器的視口，不包括工具欄和滾動條）。 對於Internet Explorer、Chrome、Firefox、Opera 以及 Safari： window.innerHeight - 瀏覽器窗口的內部高度 window.innerWidth - 瀏覽器窗口的內部寬度 對於 Internet Explorer 八、七、六、5： document.documentElement.clientHeight document.documentElement.clientWidth 或者 document.body.clientHeight document.body.clientWidth

屏幕 尺寸 screen.availWidth - 可用的屏幕寬度(不包含下面的任務欄，包含上面的瀏覽器地址等全部上面的部分) screen.availHeight - 可用的屏幕高度(不包含下面的任務欄，包含上面的瀏覽器地址等全部上面的部分) screen.height-屏幕高度（包含整個屏幕，如電腦的大小是1920*1080，屏幕高度就是1080）

clientWidth = width + padding offsetWidth = width + padding + border

1.offsetWidth屬性能夠返回對象的padding+border+width屬性值之和，style.width返回值就是定義的width屬性值。

2.offsetWidth屬性僅是可讀屬性，而style.width是可讀寫的。

3.offsetWidth屬性返回值是整數，而style.width的返回值是字符串，而且帶有單位。

4.style.width僅能返回以style方式定義的內部樣式表的width屬性值。