位置: 编程技术 - 正文

基于js中style.width与offsetWidth的区别(详解)(style js)

编辑:rootadmin

推荐整理分享基于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),且返回值只为一个数值,不带单位。

如下面的例子所示:

基于js中style.width与offsetWidth的区别(详解)(style js)

控制台输出的第一个结果为: 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页面点击怎么随机生成图片)

  • 车船税可以免掉吗
  • 承兑汇票用开发票吗
  • 奖金算不算工资薪金所得
  • 出口退税综合服务平台广东
  • 财务专用章的重要性
  • 专用发票二维码压线
  • 银行汇票存款和银行存款的区别
  • 清算费用会计科目设置
  • 小规模纳税人普通发票可以抵税吗
  • 保证金抵扣货款分录
  • 员工入股怎么分成
  • 发生成本支出发票未到
  • 未入账的记账凭证有误处理方法
  • 银行取现怎么取
  • 一般纳税人有什么优惠政策
  • 专票上的账号打错了
  • 机打发票2017年7月份以后可以用吗?
  • 营改增后如何对建安企业进行税务稽查
  • 如何界定广告
  • 环保税是甲方交的吗
  • 公司租赁房屋的物业费怎么入账
  • 租入办公设备的租金计入什么科目
  • 补提以前年度摊销
  • 上月计提租赁费下月扣怎么做账
  • 工资放在主营业务成本和放在管理费用一样吗
  • 退休返聘人员工伤怎么赔偿
  • 筹建期发生的费用是放在那个科目
  • 申报个税是按哪个月的工资表
  • 关于积分的三种账务处理方法
  • 普票被退回如何处理
  • 进项税转出怎么填报表
  • 小规模纳税人销售自己使用过的固定资产税率
  • 增值税发票认证操作流程
  • linux的使用场合
  • ati2mdxx.exe是什么进程 ati2mdxx进程信息查询
  • 增值税出口服务包括什么
  • 什么叫即期结汇
  • win10开机强制进入修复模式
  • 社保缴纳基数相差多少
  • .fas文件病毒
  • 软件企业职工培训费税前扣除标准
  • 生产型企业出口不是自己生产的东西
  • 薄雾笼罩着整个森林
  • 日落时分谭咏麟歌词
  • f12过滤请求
  • ps怎么参考线快捷键
  • 已勾选确认的发票忘记填写怎么办
  • 企业所得税核查报告
  • 开发区政府退税政策合法吗
  • 销项税额和进项税额月底怎么结转
  • 向农业生产者收购的原木 进项
  • 企业中间投入
  • 母公司代子公司收款,子公司开具发票
  • 重大水利工程建设
  • 客户逾期不付款,需要赔多少违约金
  • 开票金额大于付款金额 多余部分为返点
  • 管理费用是负数影响利润表吗
  • 营业收入包括哪些内容?
  • 查询sql server版本
  • 大数据量分页查询
  • win2003注册表空间不足
  • ubuntu 14.10
  • freenas11.2安装教程
  • 如何创建一个wifi
  • csrss exe
  • centos zsh
  • I810 Graphics LINUX Driver的安装
  • 导入extjs、jquery 文件时$使用冲突问题解决方法
  • hbuilderx打包app教程
  • jquery实现轮播图原理
  • js限制字符长度
  • python爬虫详解
  • 安卓开发例子
  • js变量作用域
  • 对税务工作提出意见建议
  • 甘肃国家税务局兰州专用章图片
  • 安徽省合肥市地震多少级
  • 期房交了契税就可以拿房产证了吗
  • 作废税票会影响税率吗
  • 电子税局个税申报步骤
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设