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的区别
JavaScript属性scrollLeft,scrollWidth,clientWidth,offsetWidth之完全详解
主要介绍了scrollWidth,clientWidth,offsetWidth的区别,需要的朋友可以参考下
HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth完全详解
javascript scrollLeft,scrollWidth,clientWidth,offsetWidth 完全详解,实例修正版。
图示offsetWidth、clientWidth、scrollWidth、scrollTop、scrollLeft等属性，对于一些页面的控制很有帮助。
关于js中的offsetWidth、clientWidth、scrollWidth等一系列属性及其方法一直都傻傻分不清，这里就来总结一下这些方法的用法和含义。 一、clientWidth和clientHeigh 、 clientTop和clientLeft 1，clientWidth的实际...
父元素与子元素的scrollWidth/offsetWidth/clientWidth
scrollLeft,scrollWidth,clientWidth,offsetWidth完全详解 2009年12月14日，16:58:19 | ArthurXF scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的...
有时候项目中会用到用js获取元素位置来定位元素，首先通过图片说明scrollWidth,clientWidth,offsetWidth的关系。 JS获取各种宽度、高度的简单介绍： scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取...
四种浏览器对_clientHeight、offsetHeight、scrollHeight、clientWidth、offsetWidth_和_scrollWidth_的解
1. 正确理解offsetWidth、clientWidth、scrollWidth及相应的height属性 假设某一个元素的横纵向滚动条都拖动到最末端，则offsetWidth、clientWidth、scrollWidth等属性相应的范围如下图所示： 1）offsetWidth ，...
IE6在页面内容超出窗口大小时将宽度属性scrollWidth、clientWidth、offsetWidth都解释为内容实际宽度。 上次的测试说明了document.body属性并不会给我们返回预期的结果，比如我们用document.body.clientHeight原本想...
scrollWidth,clientWidth,offsetWidth的区别 offsetX,clientX,pageX的辨析 下载源码链接 代码实例 <div id=box xss=removed></div> (function () { var dragging = false var boxX, boxY, mouseX, mouseY, ...
网页可见区域宽： document.body.clientWidth; 网页可见区域高： document.body.clientHeight; 网页可见区域宽： document.body.offsetWidth (包括边线和滚动条的宽); 网页可见区域高： document.body....
网页可见区域宽： document.body.clientWidth; 网页可见区域高： document.body.clientHeight; 网页可见区域宽： document.body.offsetWidth (包括边线的宽); 网页可见区域高： document.body.offsetHeight (包括...
在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果...offsetWidth clientWidth scrollWidth offsetHeight clientHeight scrollHeight offsetLeft clientLeft scrollLeft offsetTop clientT
网页可见区域宽： document.body.clientWidth;网页可见区域高： document.body.clientHeight;网页可见区域宽： document.body.offsetWidth (包括边线的宽);网页可见区域高： document.body.offsetHeight (包括边线...