位置: 编程技术 - 正文

基于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页面点击怎么随机生成图片)

  • 增值税发票综合服务平台验证口令失败
  • 外商投资企业要实缴资本么
  • 实缴时间不能超过申请时间怎么办
  • 公司欠款利息收入需要交增值税吗?
  • 8.会计核算方法具体包括哪些内容?
  • 成立小规模纳税人注册资金多少
  • 财政拨款收入和财政补助收入的区别
  • 暂估入库商品用什么科目
  • 房地产企业交房时如何开票
  • 收社团费用怎么说
  • 收购农产品销售会计分录怎么写
  • 制造费用年末需要结转吗
  • 上年度多计提的工资怎么冲减
  • 兼营销售的销售额的确定
  • mac更新系统版本
  • 销售合作分成会计分录
  • 怎么更新电脑系统win10
  • mac怎么快速显示桌面
  • php设计思路
  • 公司收到款后怎么做账
  • 深度linux使用入门教程
  • 年末结转利润分配账户的借方余额表示
  • 深入解析wordpress
  • php声明一个类
  • 外商投资企业需要备案吗
  • 存货核算有哪些内容
  • 换出长期股权投资的会计处理
  • nodejs vue
  • javascriptz
  • pytorch map
  • 企业所得税的调增调减怎么理解
  • 发票记账联可以给客户吗
  • 年终奖怎么缴纳
  • 增值税加计扣除计入什么科目
  • 增值税发票怎么领取
  • sql使用cast进行数据类型转换示例
  • mysql数据库性能优化方法有哪些
  • 什么是企业所得税收入
  • 建筑行业旧项目怎么处理
  • 红冲以前年度费用
  • 事业单位外出参观培训心得
  • 检测费用开票税率
  • 日常生活中常见的气质类型包括
  • 公司成立前的费用发票可以入账吗
  • 产品生产完工入库
  • 业务招待费的列支范围
  • 银行日记账记错了怎么办
  • 投资收益的主要来源有
  • 一般纳税人网上申报流程
  • 金蝶财务软件服务器
  • 什么样的发票公司可以开
  • 快递行业的会计岗位
  • 破产重整期间转让股权
  • 会计账务做得混乱的原因
  • 主营业务收入是什么意思
  • 出售固定资产属于什么收入
  • 代理进口业务会计分录
  • MySQL 4.1/5.0/5.1/5.5/5.6各版本的主要区别整理
  • sql group by语句
  • linux统计重复次数
  • linux dd 系统
  • ubuntu 16.10
  • linux crontab用法
  • win10如何将我的电脑添加到桌面
  • linux 压缩解压缩
  • cmd命令如何进入d盘
  • cocos2dx 3.3 helloworld 入门 学习与详解
  • cmd更改文件属性
  • javascript内置对象应用团购
  • node.js开发实战详解
  • unity3d移动代码
  • Android性能优化的方面12个
  • python多进程共享对象
  • android开发指南
  • javascript学习指南
  • jquery通配符选择器
  • 出租车票真伪查询官网
  • 临时占地耕地占用税纳税义务发生时间
  • 贵州国家税务局陈开平
  • 个人所得税的工资比实际的多
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设