js中offsetWidth怎么用

这篇文章主要介绍js中offsetWidth怎么用，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

　　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

　　*

　　******元素视图属性结束

　　*

以上是“js中offsetWidth怎么用”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注亿速云行业资讯频道！