scrollWidth,clientWidth,offsetWidth的區別

scrollWidth：對象的實際內容的寬度，不包邊線寬度，會隨對象中內容超過可視區後而變大。
clientWidth：對象內容的可視區的寬度，不包滾動條等邊線，會隨對象顯示大小的變化而改變。
offsetWidth：對象整體的實際寬度，包滾動條等邊線，會隨對象顯示大小的變化而改變。

通過一個demo來說明下：

• 情況1：

  元素內無內容或者內容不超過可視區，滾動不出現或不可用的情況下。scrollWidth=clientWidth，兩者皆爲內容可視區的寬度。offsetWidth爲元素的實際寬度。
  

• 情況2

  元素的內容超過可視區，滾動條出現和可用的情況下。
  scrollWidth>clientWidth。scrollWidth爲實際內容的寬度。clientWidth是內容可視區的寬度。offsetWidth是元素的實際寬度。