scrollWidth,clientWidth與offsetWidth的區別_經驗交流
- PHP中文网原創
- 2016-05-16 12:07:351695瀏覽
scrollwidth,clientwidth與offsetwidth的區別_經驗交流
scrollwidth
是對象的實際內容的寬，不包邊線寬度，會隨對象內容的多少改變（內容多了可能改變物體的實際寬度）。
clientwidth
是物件可見的寬度，不包捲軸等邊線，會隨視窗的顯示大小改變。
offsetwidth
是物件的可見寬度，包包捲軸等邊線，會隨視窗的顯示大小改變。
一個scrollwidth和clientwidth的例子：
<html>
<head>
<title>77.htm文件</title>
</head>
<body>
<textarea wrap="off" onfocus="alert('scrollwidth:'+this.scrollwidth+'\n clientwidth:'+this.clientwidth);">
</textarea>
</body>
</html>
在文字方塊內輸入內容，當橫向滾動條沒出來前scrollwidth和clientwidth的值是一樣的。當一行內容超出文字方塊的寬度，就有橫向捲軸出來了，scrollwidth的值就變了。
scrollwidth是物件實際內容的寬度。
clientwidth是物件看到的寬度（不含邊線），這個範例裡不會改變。
一個clientwidth和offsetwidth的範例：
<html>
<head>
<title>77.htm文件</title>
</head>
<body>
<textarea wrap="off" onfocus="alert('offsetWidth:'+this.offsetWidth+'\n clientWidth:'+this.clientWidth);">
</textarea>
</body>
</html>
offsetwidth的值總是比clientwidth的值大。
clientwidth是物件看到的寬度（不含邊線）
offsetwidth是物件看到的寬度（含邊線，如滾動條的佔用的寬）
以上就是scrollwidth,clientwidth與offsetwidth的差別_經驗交流的內容，更多相關內容請關注php中文網（www.php.cn）！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn