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

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

如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,
这同offsetLeft是相同的;

二者的区别在于:

1.style.left返回的是字符串,如30px,offsetLeft返回的是数值30;

2.style.left是可读写的,而是offsetLeft是只读的,因此如果要改变div的位置,只能修改style.left;

3.style.left的值需要事先定义,否则取到的值为空;而且定义在css里是无法识别的,取到的值将依然为空,只有在html里定义的才有效;

——注:来自慕课上WayneJ老师讲解

 
 
 

offsetleft 和 style.left 的区别的更多相关文章

  1. offsetLeft和style.left的区别

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

  2. DOM中offsetLeft与style.left的区别

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

  3. offsetLeft与style.left的区别

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

  4. android 中theme.xml与style.xml的区别

    from://http://liangoogle.iteye.com/blog/1848448 android 中theme.xml与style.xml的区别: 相同点: 两者的定义相同. <r ...

  5. offsetLeft与style.left区别

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

  6. 04-offsetLeft和style.left的区别

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

  7. .style, .getComputedStyle(),.currentStyle区别

    1)style只能获取行间样式(写在标签里面的):能读能写 2)currentStyle是专属ie的属性,区别他返回的是最终样式 及包括行间和外链css 3)getComputedStyle是一个可以 ...

  8. js中的offsetLeft和style.left

    (1)style.left是带单位"px"的,而offsetLeft没有单位,另外,style.left必须是内联样式,或者在JS中通过style.left赋值,否则取得的将为空字 ...

  9. js和jq中常见的各种位置距离之offsetLeft和position().left的区别(四)

    offsetLeft:元素的边框的外边缘距离与已定位的父容器(offsetparent)的左边距离(不包括元素的边框和父容器的边框).position().left:使用position().left ...

随机推荐

  1. 20190815 On Java8 第五章 控制流

    第五章 控制流 迭代语句 逗号操作符 在 Java 中逗号运算符(这里并非指我们平常用于分隔定义和方法参数的逗号分隔符)仅有一种用法:在 for 循环的初始化和步进控制中定义多个变量.我们可以使用逗号 ...

  2. app自动化appium使用内置adb命令

    一.Appium-server使用 1.登陆页面 高级设置:可以设置Android 和 IOS 日志级别:dabug非常详尽的日志 记录python代码向他发送的请求以及他在收到请求后做的一系列处理 ...

  3. C#=>递归反转栈

    原理,递归反转栈 using System; using System.Collections.Generic; using System.Linq; using System.Threading.T ...

  4. #python# error:http.client.RemoteDisconnected: Remote end closed connection without response

    添加headers user-agent 网络情况不好的状态下也能出现

  5. Servlet+AJAX实现的模拟电梯调度

    需求产生: 大三下学期天天在学校的同一栋教学楼上课,每天要等四次电梯,有次等电梯无聊了,就想到电梯的运行逻辑该如何用程序来表达呢? 问题描述: 大学的那栋楼有21层,不过在页面中画21层有点密,所以只 ...

  6. CSU 1092 Barricade

    1092: Barricade Time Limit: 1 Sec  Memory Limit: 32 MBSubmit: 240  Solved: 71[Submit][Status][Web Bo ...

  7. 【主机管理项目】-(models.py(一对多、多对多数据库创建代码))

    # -*- coding: utf-8 -*- from __future__ import unicode_literals from django.db import models class U ...

  8. JVM(14)之 类加载机制

    开发十年,就只剩下这套架构体系了! >>>   从本篇博文开始,我们就进入虚拟机类加载机制的学习了.那么什么是类加载呢?当我们写完一个Java类的时候,并不是直接就可以运行的,它还要 ...

  9. Java 时间类 Date 和 Calendar

    在项目中获取一个yyyy-MM-dd HH:mm:ss格式的时间字符串 package org.htsg.kits; import java.text.SimpleDateFormat; import ...

  10. 一、RequireHttps

    一.RequireHttps 强制使用Https重新发送请求:如: public class HomeController : Controller { [RequireHttps] public A ...