offsetLeft 获取的是相对于父对象的左边距

left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距

如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,
这同offsetLeft是相同的,区别在于:
1. style.left 返回的是字符串,如28px,offsetLeft返回的是数值28,如果需要对取得的值进行计算,
还用offsetLeft比较方便。
2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。
3. style.left的值需要事先定义,否则取到的值为空。而且必须要定义在html里,我做过试验,如果定义在
css里,style.left的值仍然为空,这就是我刚开始碰到的问题,总是取不到style.left的值。

offsetLeft则仍然能够取到,无需事先定义div的位置。

DOM中offsetLeft与style.left的区别的更多相关文章

  1. offsetLeft和style.left的区别

    offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...

  2. offsetLeft与style.left的区别

    参考:http://www.cnblogs.com/woshilee/articles/1951457.html offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定 ...

  3. offsetleft 和 style.left 的区别

    offsetLeft 获取的是相对于父对象的左边距: left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距: 如果父div的position定义为rel ...

  4. DOM中的node与element的区别

    先看document的两个常见method. document.createTextNode Constructor: Text document.createElement Constructor: ...

  5. 详解 javascript中offsetleft属性的用法(转)

    详解 javascript中offsetleft属性的用法 转载  2015-11-11   投稿:mrr    我要评论 本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...

  6. offsetLeft与style.left区别

    在javascript中经常遇到style.left和offsetLeft,那么它们有什么区别呢?今天我们来分析下 offsetLeft:获取当前元素相对于父元素的左侧偏移量,比如该元素设置为rela ...

  7. JS中offsetLeft,Left,clientLeft的区别(纯转贴)

    假设 obj 为某个 HTML 控件. obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型,单位像素. obj.offsetLeft ...

  8. JS学习之DOM节点的关系属性封装、克隆节点、Dom中Style常用的一些属性等小结

    JS DOM节点: 在JS DOM中节点的关系被定义为节点的属性: 通常有以下几种节点之间的关系: (这里的关系是所有浏览器都支持的) parentNode    父节点 childNodes     ...

  9. DOM 中 Property 和 Attribute 的区别

    原文地址:http://web.jobbole.com/83129/ property 和 attribute非常容易混淆,两个单词的中文翻译也都非常相近(property:属性,attribute: ...

随机推荐

  1. python-day81--Ajax

    一.准备知识:json 1.什么是json? JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式.任何的语言之间都可以用json进行数据的交 ...

  2. hdu-6434-欧拉函数

    Problem I. Count Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 524288/524288 K (Java/Other ...

  3. poj-2888-矩阵+polya

    Magic Bracelet Time Limit: 2000MS   Memory Limit: 131072K Total Submissions: 6195   Accepted: 1969 D ...

  4. oracle中给表和列起别名

    SELECT xxmc,sname as xsxm,sex,phone,address jzdz FROM student s LEFT JOIN xxjbxx x ON x.sid = s.sid ...

  5. python中bottle模块的使用

    1.简介 2.示例 2.1一个简单的bottle接口 # -*- coding: utf-8 -*- from bottle import route, request, run import jso ...

  6. Oracle12c CDB架构图

  7. 解决 TCP_socket 粘包问题

    所谓粘包问题主要还是C/S两端数据传输时 因为接收方不知道消息之间的界限,不知道一次性提取多少字节的数据所造成的 根本原因:粘包是由TCP协议本身造成的,TCP为提高传输效率,发送方往往要收集到足够多 ...

  8. Python print打印

    1.Python运算符: +:加 -:减 *:乘 /:除以 %:去除法后的余数 //:取整除 2.字符串center方法: a='111'print(a.center(4,'2')) #让字符串占位 ...

  9. LSTM UEBA异常检测——deeplog里其实提到了,就是多分类LSTM算法,结合LSTM预测误差来检测异常参数

    结合CNN的可以参考:http://fcst.ceaj.org/CN/article/downloadArticleFile.do?attachType=PDF&id=1497 除了行为,其他 ...

  10. vue-router 路由钩子(hook)

    钩子(hook)—劫持机制 路由钩子(守卫钩子): 1.全局钩子2.某个路由独享的钩子3.组件内钩子 三种路由钩子中都涉及到了三个参数,官方(https://router.vuejs.org/zh-c ...