width这样读取出来是一个字符串，并且带有单位，但是offsetwidth返回的是一个数值。
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<title>未定义</title>
<style type="text/css">
div{
width:100px;
height:100px;
border:5px solid red;
background-color:green;
padding:3px;
}
</style>
<script type="text/javascript">
window.onload=function(){
var _mytest=document.getElementById("mytest");
console.log("fsfs"+document.getElementById("mytest").offsetWidth);
console.log("aa"+document.getElementById("mytest").style.width)
}
</script>
</head>
<body>
<div id="mytest"></div>
</body>
</html>
，offsetWidth属性可以返回div的宽度，但是style.width并不能够返回此div的宽度。（因为在js中不能直接把获取写在样式表中的样式）
由运行结果也可以看出offsetWidth返回的宽度值包括:border+width+padding
但是如果把样式加载行内，就可以读取到了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
window.onload=function()
{
var oDiv=document.getElementById('div1');
var a=oDiv.style.width;
alert(typeof a);
alert(a);
}
</script>
</head>
<body>
<div id="div1" style="width:200px"></div>
</body>
</html>
width这样读取出来的不是一个数值，而是一个字符串，并且带有单位，但是offsetwidth返回的是一个数值。
这应该是两者在本质上的一个区别，还有在网上之前又看到过一种说法：
object.offsetLeft代表是当前object和父元素已经定义好的左边距。
object.style.left代表是object和父元素需要定义的左边距
不知道可不可以这样理解：offsetLeft是已经有的值，而left是需要计算的值，因此在运动框架的联系中经常看到的是将offsetLeft的值赋给left~~~
接下来一张图说明两者表象上的区别：
width这样读取出来是一个字符串，并且带有单位，但是offsetwidth返回的是一个数值。的更多相关文章
- <!-- str.startsWith('胡') 检查一个 字符串中是否有某字符 返回true false -->& vh 属性
1.<!-- str.startsWith('胡') 检查一个 字符串中是否有某字符 返回true false --> 2. vh 分享到选择其它项 复制本页链接 版本:CSS3 补 ...
- Python判断一个字符串中是否存在多个子串中的一个
在使用python的开发过程中,常常需要判断,字符串中是否存在子串的问题, 但判断一个字符串中是否存在多个字串中的一个时,如if (a or b) in c或者if x contains a|b|c| ...
- Java将整个文件夹里的文本中的字符串替换成另外一个字符串（可用于项目复制，变成另一个项目）
import org.junit.Test; import java.io.*; /** * User: HYY * Date: 13-8-18 * Time: 下午8:11 * To change ...
- StrStr,判断一个字符串是不是另一个字符串的字串，并返回子串的位置
public int strStr(String haystack, String needle) { if(haystack == null || needle == null) { return ...
- Hashtable集合 --练习题_计算一个字符串中每个字符出现次数
Hashtable集合 java.util.Hashtable<K,V>集合 implements Map<K,V>接口 Hashtable:底层也是一个哈希表,是一个线程安 ...
- ES6--javascript判断一个字符串是否存在另一个字符串中
es5中我们经常使用indexof()方法来判断一个字符串是否包含另外一个字符串中. 如果存在则返回匹配到的第一个索引值.如果没有则返回 -1.所以,判断一个字符串是否包含另外一个字符串中只需要判断是 ...
- php中读取文件内容的几种方法。（file_get_contents：将文件内容读入一个字符串）
php中读取文件内容的几种方法.(file_get_contents:将文件内容读入一个字符串) 一.总结 php中读取文件内容的几种方法(file_get_contents:将文件内容读入一个字符串 ...
- 字符串混淆技术应用 设计一个字符串混淆程序 可混淆.NET程序集中的字符串
关于字符串的研究,目前已经有两篇. 原理篇:字符串混淆技术在.NET程序保护中的应用及如何解密被混淆的字符串 实践篇:字符串反混淆实战 Dotfuscator 4.9 字符串加密技术应对策略 今天来 ...
- （转）sscanf() - 从一个字符串中读进与指定格式相符的数据
(转)sscanf() - 从一个字符串中读进与指定格式相符的数据 sscanf() - 从一个字符串中读进与指定格式相符的数据. 函数原型: Int sscanf( string str, stri ...
随机推荐
- C语言中static作用
在C语言中,static的字面意思很容易把我们导入歧途,其实它的作用有三条. (1)先来介绍它的第一条也是最重要的一条:隐藏. 当我们同时编译多个文件时,所有未加static前缀的全局变量和函数都具有 ...
- java 面向抽象编程的思想
SIM.java public abstract class SIM { public abstract void setNumber(String n); public abstract Strin ...
- elasticsearch高级配置之（一）----分片分布规则设置
cluster.routing.allocation.allow_rebalance 设置根据集群中机器的状态来重新分配分片,可以设置为always, indices_primaries_active ...
- 动态规划之----我们可以用2*1的小矩形横着或者竖着去覆盖更大的矩形。请问用n个2*1的小矩形无重叠地覆盖一个2*n的大矩形，总共有多少种方法？
利用动态规划,一共有n列,若从左向右放小矩形,有两种放置方式: 第一种:横着放,即占用两列.此时第二行的前两个空格只能横着放,所有,总的放置次数变为1+num(2*(n-2)),其中2*(n-2)代表 ...
- Node.js学习 - Buffer
JavaScript 语言自身只有字符串数据类型,没有二进制数据类型.但在处理像TCP流或文件流时,必须使用到二进制数据. 因此在 Node.js中,定义了一个 Buffer 类,该类用来创建一个专门 ...
- plat模板修改记录
每个栏目显示文章数 homepage.hph 94行 $loop = new WP_Query('post_type=post&showposts=6&category_name=xi ...
- C# 上传文件至远程服务器
C# 上传文件至远程服务器(适用于桌面程序及web程序) 2009-12-30 19:21:28| 分类: C#|举报|字号 订阅 最近几天在玩桌面程序,在这里跟大家共享下如何将本地文件上传 ...
- L5,no wrong numbers
expressions: up to now,到现在为止 a great many,数量很大 in a way,在某种意义上说 words: burn,vt燃烧,vi烧毁,n灼烧 obtain,v ...
- Git 分支-利用分支进行开发的工作流程
3.4 Git 分支 - 利用分支进行开发的工作流程 利用分支进行开发的工作流程 现在我们已经学会了新建分支和合并分支,可以(或应该)用它来做点什么呢?在本节,我们会介绍一些利用分支进行开发的工作流程 ...
- URL 传+号到后台变空格问题解决方案
今天巧合遇到这个问题,下面是网上找的解决方案. 原文:http://blog.sina.com.cn/s/blog_a0949eec01010xta.html 今天在调试客户端向服务器传递参数时,参数 ...