1. style.width只能读取内联样式，offsetWidth都可以读取；

2. style.width读取的值带“px”单位，offsetWidth读取纯数值；

3. style.width获取的只是div的宽度,不包括border和padding所占的宽度, 而offsetWidth获取的宽度是width+border+padding的值(但不包括margin)

4. offsetWidth是只读的，style.width是可读可写的

style.width与offsetWidth的区别的更多相关文章

  1. 点击按钮，缩放图片（img.width、img.style.width、img.offsetWidth）

    前几天在慕课网上看到一个关于图片缩放的教学视频,因为当时对老师使用img.width,而不是使用img.style.width而感到奇怪,所以周末得空了,想来自己试着写出来,相关视频网址如下:http ...

  2. dom.style.left 与 dom.offsetLeft区别

    dom.style.left    初始空值,必须在html行内样式定义值才有值,在css样式定义仍为空值                         可读写,是字符串,读写是必须加px,否则无效 ...

  3. H5 canvas的 width、height 与style中宽高的区别

    Canvas 的width height属性 1.当使用width height属性时,显示正常不会被拉伸:如下 <canvas id="mycanvas" width=&q ...

  4. css width="100" style ="width:100px" 区别

    1. width="100"是正确的,而 width="100px"是错误的, style = "width:100px"是正确的 2. s ...

  5. js的 style.width 取不到元素的宽度值

    以前一直用jquery的.width()方法来获取一个元素的当前的宽度.不管该元素是否设置了宽度,CSS样式是内联.外联or内嵌,都可用此方式获得元素当前的宽度. 今天想用原生JS想获取一个元素宽度时 ...

  6. js的style.width取不到元素的宽度值

    使用jquery的.width()方法获取一个元素的当前宽度,不管元素是否设置了宽度,css样式时内联 外联或者是内嵌,都可以使用 这个方法获取元素的宽度. 使用原生js style.width .w ...

  7. CSS width：100%和width：auto的区别

    width:100%和width:auto的区别 width:auto比较聪明,如果margin已经左右占去10px的空间,那么width给的值就是580px. <style> div{ ...

  8. style、currentStyle、getComputedStyle区别介绍

    style.currentStyle.getComputedStyle区别介绍 来自:蓝色天空 样式表有三种方式 内嵌样式(inline Style) :是写在Tag里面的,内嵌样式只对所有的Tag有 ...

  9. style.left offsetLeft offsetwidth clientLeft clientWidth scrollLeft scrollWidth

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

随机推荐

  1. 目标检测（四）Faster R-CNN: Towards Real-Time Object Detection with Region Proposal Networks

    作者:Shaoqing Ren, Kaiming He, Ross Girshick, and Jian Sun SPPnet.Fast R-CNN等目标检测算法已经大幅降低了目标检测网络的运行时间. ...

  2. 使用spring data solr 实现搜索关键字高亮显示

    后端实现: @Service public class ItemSearchServiceImpl implements ItemSearchService { @Autowired private ...

  3. JAVA微信支付代码（WeChatPay.java 才是调用类）

    微信官方文档:https://pay.weixin.qq.com/wiki/doc/api/index.html MD5Util.java package weixin; import java.se ...

  4. linux的查找命令 find whereis locate

    Linux 有三个查找文件的命令:find, whereis, locate 其中find 不常用,whereis与locate经常使用,因为find命令速度较慢,因为whereis与locate是利 ...

  5. java中的key事件监听机制

    package com.at221; import java.awt.event.KeyAdapter; import java.awt.event.KeyEvent; import javax.sw ...

  6. Django框架详细介绍---request对象

    几个重要的函数 1.HttpRequest.get_host() 根据从HTTP_X_FORWARDED_HOST(如果打开 USE_X_FORWARDED_HOST,默认为False和 HTTP_H ...

  7. GDScript 格式化字符串

    GDScript offers a feature called format strings, which allows reusing text templates to succinctly c ...

  8. html5与css3面试题（1）

    1.html有哪些新特性移除了哪些元素 新特性: 语义化标签(header,nav,footer.section) 音频,视频(audio,video) 画布canvas 移除元素: 表现元素:cen ...

  9. python SyntaxError: Non-ASCII character '\xe6' in file

    [1]python程序执行报错 报错:SyntaxError: Non-ASCII character '\xe6' in file /tmp/788580473/main.py on line 7, ...

  10. python str find & index 联系

    [1]相同点 (1)功能:检测字符串中是否包含子字符串str (2)语法: [1] str.find(str, beg = 0, end = len(string)) [2] str.index(st ...