位置: 编程技术 - 正文
推荐整理分享基于js中style.width与offsetWidth的区别(详解)(style js),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:style js,js给style赋值,js中style属性,js操作style,js操作style,javascript中style,js设置style属性,js style.left,内容如对您有帮助,希望把文章链接给更多的朋友!
作为一个初学者,经常会遇到在获取某一元素的宽度(高度、top值...)时,到底是用 style.width还是offsetWidth的疑惑。
1. 当样式写在行内的时候,如 <div id="box" style="width:px">时,用 style.width或者offsetWidth都可以获取元素的宽度。
但是,当样式写在样式表中时,如 #box{ width: px; }, 此时只能用offsetWidth来获取元素的宽度,而style.width所返回的值为空。
2. style.width 获取的元素宽度只是div的宽度,不包括border、和padding所占的宽度,且宽度值是带单位px的。
offsetWidth 获取的元素宽度为width+border+padding的值(不包括margin),且返回值只为一个数值,不带单位。
如下面的例子所示:
控制台输出的第一个结果为: px
控制台输出的第二个结果为: 注:+ 3x2 +1x2 = , 且不带单位
3. style.width 也可以在js中用来设置元素的宽度,而offsetWidth不可以。
如下面的例子所示:
控制台输出的结果分别为 px px
也就是说通过style.width 设置宽度成功,而 通过offsetWidth设置宽度失败。
以上这篇基于js中style.width与offsetWidth的区别(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持积木网。
js设置随机切换背景图片的简单实例 实例如下:scriptvarimgs=["
React通过父组件传递类名给子组件的实现方法 React教程React是一个用于构建用户界面的JAVASCRIPT库。React主要用于构建UI,很多人认为React是MVC中的V(视图)。React起源于Facebook的内部项目,用来架设Inst
JS实现提交表单前的数字及邮箱校检功能 个人觉得一个工程中让用户提交表单时,用户提交的数据类型及内容不确定度都很大,用户不一定会完全理解设计者意思。所以提交表单前的校检是必
标签: style js
本文链接地址:https://www.jiuchutong.com/biancheng/369779.html 转载请保留说明!上一篇:浅谈webpack下的AOP式无侵入注入(webpack-loader)
下一篇:js设置随机切换背景图片的简单实例(js页面点击怎么随机生成图片)
友情链接: 武汉网站建设