offsetWidth  //返回盒模型的宽度(包括width+左右padding+左右border)

<style>

#div1 { width:200px; height:200px; border:2px solid red; padding:5px; margin:1px; background:green;}

</style>

<div id="div1"></div>

以上div1的offsetWidth为width+2*padding+2*border=200+2*5+2*2=214px

ps:offsetLeft = left+margin-left

offsetTop = top+margin-top

js中的offsetWidth用法的更多相关文章

  1. [转载]js中return的用法

    一.返回控制与函数结果,语法为:return 表达式; 语句结束函数执行,返回调用函数,而且把表达式的值作为函数的结果 二.返回控制,无函数结果,语法为:return;  在大多数情况下,为事件处理函 ...

  2. js中this的用法

    经过近几周的模拟面试题,我查询了一些资料,今天就来说说,在js中this的用法吧.方法有四:第一,用作全局变量,第二,用作表该对象,第三,用作构造函数,第四,用作call和applay

  3. JQuery之append和appendTo的区别,还有js中的appendChild用法

    JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...

  4. JS中event.keyCode用法及keyCode对…

    js中event.keyCode用法及keyCode对照表 标签: javascriptJavaScriptJavascriptjavaScript 2012-12-11 15:11 HTML Jav ...

  5. 浅谈JS中 reduce() 的用法

    过去有很长一段时间,我一直很难理解 reduce() 这个方法的具体用法,平时也很少用到它.事实上,如果你能真正了解它的话,其实在很多地方我们都可以用得上,那么今天我们就来简单聊聊JS中 reduce ...

  6. JS中 reduce() 的用法

    过去有很长一段时间,我一直很难理解 reduce() 这个方法的具体用法,平时也很少用到它.事实上,如果你能真正了解它的话,其实在很多地方我们都可以用得上,那么今天我们就来简单聊聊JS中 reduce ...

  7. JS中的this用法详解

    随着对js的深入学习和使用,你会发现它里面包含了很多令人困惑的机制,比如对象.闭包.原型链继承等等,而这其中肯定包含令你现在或者曾经费解的this,如果你不把心一横,花点时间还真不明白这个this的用 ...

  8. JS中document.createElement()用法及注意事项

    今天处理了一个日期选择器的ie和ff的兼容问题,本来这种情况就很难找错误,找了好久才把错误定位到js中创建元素的方法document.createElement(),这个方法在ie下支持这样创建元素 ...

  9. JS中$含义和用法

    原博客:https://www.cnblogs.com/jokerjason/p/7404649.html$在JS中本身只是一个符号而异,在JS里什么也不是.但在JS应用库JQUERY的作者将之做为一 ...

随机推荐

  1. R 配色(挑花眼的色卡19色)

    cols =c("#999999","#FF0099", "#E69F00", "#56B4E9", "#00 ...

  2. CCPC E Problem Buyer

    题目描述 有一些区间,还有一些点. 问最小的k使得选出任意k个区间,每个点都可以匹配上区间,一个区间只能匹配一次. 题解 考虑对于每一个点,我们有\(x\)个区间包含它,那么答案的一个下界是\(n-x ...

  3. 进阶3: zookeeper-3.4.9.tar.gz和hbase-1.2.4-bin.tar.gz 环境搭建(hbase 伪分布式)

    前提条件: 成功安装了  jdk1.8,  hadoop2.7.3 注意条件: zookeeper,hbase 版本必须要和hadoop 安装版本相互兼容,否则容易出问题: 本次:安装包 zookee ...

  4. 设计模式之动态代理(Java的JDK动态代理实现)

    先来看一下思维导图: 对于JDK的动态代理,孔浩老师说学习的方法是把它记下来. 先写一个主题接口类,表示要完成的一个主题. package com.liwei.dynaproxy; /** * 要代理 ...

  5. kvm中添加VNC密码

      #virsh edit 虚机名 <graphics type='vnc' port='5901' autoport='no' listen='0.0.0.0' keymap='en-us'/ ...

  6. Eclipse的switch workspace 选项中删除多余的workspace

    方法1 Eclipse图形化工具: 打开Eclipse后,选择功能菜单里的Windows->Preferences->,弹出对话框后,选择General->Startup and S ...

  7. java操作JSON字符串转换成对象的时候如何可以不建立实体类也能获取数据

    引入依赖 <dependency>    <groupId>com.alibaba</groupId>    <artifactId>fastjson& ...

  8. 013-Spring Boot web【二】静态资源、Servlet、Filter、listenter

    一.静态资源 1.1.webapp默认支持静态资源 在src/main/webapp下建立user.html默认支持访问 1.2.默认内置静态资源目录.可被直接访问 查看包:spring-boot-a ...

  9. 从 spring-cloud-alibaba-nacos-config 进入 nacos-client

    sc 的 bootstrap context 是 main application context 的 parent,需要在 main application context 中使用的 bean 可以 ...

  10. VMware 虚拟化编程(11) — VMware 虚拟机的全量备份与增量备份方案

    目录 目录 前文列表 全量备份数据的获取方式 增量备份数据的获取过程 前文列表 VMware 虚拟化编程(1) - VMDK/VDDK/VixDiskLib/VADP 概念简析 VMware 虚拟化编 ...