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. jquery基础学习之AJAX篇（五）

    理解不深,只知道这么用 jquery 中ajax的请求方法 $.ajax({ url:‘http://...’, //请求网址 type:'GET', //请求方法 success:function( ...

  2. SpringMVC Maven项目 java.lang.ClassNotFoundException: org.springframework.web.servlet.DispatcherServle

    今天在搭建SpringMVC开发框架时,遇到了一个问题,尽管在maven的POM.xml文件中配置了项目所依赖的jar包,但在启动项目是已然报错如下: 信息: Starting Servlet Eng ...

  3. Android adt-bundle 开发环境的搭建_Linuxs

    本文完全是拷贝的: https://www.jb51.net/article/87957.htm  的文章, 有需要请看原文, 拷贝仅用于学习记录. 本文与<利用adt-bundle轻松搭建An ...

  4. windows程序设计 vs2012 新建win32项目

    1.文件->新建->项目 2.选择win32项目,确定 3.下一步 4.选择windows应用程序,选中空项目,安全开发生命周期不选.点击完成. 5.空项目建好了.

  5. Gitlab安装以及汉化

    Gitlab安装以及汉化 系统环境: CentOS 7.5 IP:192.168.1.2 关闭selinux.firewalld gitlab-ce-10.8.4 rpm包:下载地址 一.下载并安装g ...

  6. 一个不错的git资源站点

    https://backlog.com/git-tutorial/cn/stepup/stepup2_8.html

  7. linux下安装svn服务器

    http://www.cnblogs.com/zhoulf/archive/2013/02/02/2889949.html 安装说明系统环境:CentOS-6.3安装方式:yum install (源 ...

  8. bzoj4195（并查集+离散化）

    题目大意:给出n个变量互相的相等或不等关系,求这些关系是否矛盾 思路:把相等的变量加入并查集,不等的查询是否合法 eg:数据很大,离散化(然而我用的是map) #include<stdio.h& ...

  9. laravel中empty()，is_null() 以及isEmpty()

    PHP中 empty() empty() 函数用于检查一个变量是否为空. if(empty($result->order)){ //操作 } is_null() is_null() 函数用于检测 ...

  10. Mysql 集合链接查询

    MySQL NULL 值处理 需求:我们已经知道MySQL使用 SQL SELECT 命令及 WHERE 子句来读取数据表中的数据,但是当提供的查询条件字段为 NULL 时,该命令可能就无法正常工作. ...