关于js中的offsetWidth、clientWidth、scrollWidth等一系列属性及其方法一直都傻傻分不清，这里就来总结一下这些方法的用法和含义。
js中的offsetWidth用法
offsetWidth//返回盒模型的宽度（包括width+左右padding+左右border）
<style>
#div1{width:200px;height:200px;border:2pxsolidred;padding:5px;margin:1px;background:green;}
</style>
<divid="div1"></div>
以上div1的offsetWidth为width+2*padding+2*border=200+2*5+2*2=214px
ps：offsetLeft=left+margin-left
offsetTop=top+margin-top
offsetWidth与其他属性不同
注意：下面元素属性和元素方法都通过elem.属性或elem.方法的方式使用，window属性通过window.属性的方式使用，document属性则通过document调用。
<script>
/*
******元素视图属性
*offsetWidth水平方向width+左右padding+左右border-width
*offsetHeight垂直方向height+上下padding+上下border-width
*
*clientWidth水平方向width+左右padding
*clientHeight垂直方向height+上下padding
*
*offsetTop获取当前元素到定位父节点的top方向的距离
*offsetLeft获取当前元素到定位父节点的left方向的距离
*
*scrollWidth元素内容真实的宽度，内容不超出盒子高度时为盒子的clientWidth
*scrollHeight元素内容真实的高度，内容不超出盒子高度时为盒子的clientHeight
*
******元素视图属性结束
*
总之，offsetWidth给大家简单的介绍了一些，希望大家多看看。