javascript中style.left和offsetLeft的用法说明


Posted in Javascript onMarch 07, 2014

如果父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的位置。

// 这个函数是对 一个无穷分类的 下拉框的操作,页面开始只有一个下拉框,当选中下拉框一个值后,
动态生成一个select, select的项是子分类,同时要使子分类的select框后移 20px;

function itemtree_cats_change ( selectObj )
Javascript 相关文章推荐
JavaScript窗口功能指南之在窗口中书写内容
Jul 21 Javascript
JS获取键盘上任意按键的值(实例代码)
Nov 12 Javascript
javascript unicode与GBK2312(中文)编码转换方法
Nov 14 Javascript
js中for in语句的用法讲解
Apr 24 Javascript
JS+CSS实现滑动切换tab菜单效果
Aug 25 Javascript
BootStrap中Tab页签切换实例代码
May 30 Javascript
老生常谈javascript的类型转换
Oct 12 Javascript
Angular2使用Guard和Resolve进行验证和权限控制
Apr 24 Javascript
微信小程序wx:for循环的实例详解
Oct 07 Javascript
vue自定义表单生成器form-create使用详解
Jul 19 Javascript
element-ui中Table表格省市区合并单元格的方法实现
Aug 07 Javascript
关于React Native 无法链接模拟器的问题
Jun 21 Javascript
js读取被点击次数的简单实例(从数据库中读取)
Mar 07 #Javascript
js函数名与form表单元素同名冲突的问题
Mar 07 #Javascript
javascript(js)的小数点乘法除法问题详解
Mar 07 #Javascript
jquery中常用的函数和属性详细解析
Mar 07 #Javascript
jquery 操作两个select实现值之间的互相传递
Mar 07 #Javascript
JS判断文本框内容改变事件的简单实例
Mar 07 #Javascript
使用js判断TextBox控件值改变然后出发事件
Mar 07 #Javascript
You might like
phpBB BBcode处理的漏洞
2006/10/09 PHP
PHP安装攻略:常见问题解答(一)
2006/10/09 PHP
php中的strpos使用示例
2014/02/27 PHP
destoon实现底部添加你是第几位访问者的方法
2014/07/15 PHP
jquery中常用的SET和GET
2009/01/13 Javascript
javascript下4个跨浏览器必备的函数
2010/03/07 Javascript
jquerymobile checkbox及时刷新才能获取其准确值
2012/04/14 Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
2013/01/11 Javascript
点击进行复制的JS代码实例
2013/08/23 Javascript
Node.js开发指南中的简单实例(mysql版)
2013/09/17 Javascript
多种方法判断Javascript对象是否存在
2013/09/22 Javascript
jquery使用$(element).is()来判断获取的tagName
2014/08/24 Javascript
javascript 闭包详解
2015/07/02 Javascript
JavaScript Math 对象常用方法总结
2016/04/28 Javascript
JavaScript实现的贝塞尔曲线算法简单示例
2018/01/30 Javascript
详解Vue内部怎样处理props选项的多种写法
2018/11/06 Javascript
浅谈在Vue.js中如何实现时间转换指令
2019/01/06 Javascript
vue.js iview打包上线后字体图标不显示解决办法
2020/01/20 Javascript
vue实现虚拟列表功能的代码
2020/07/28 Javascript
[02:35]DOTA2英雄基础教程 末日使者
2013/12/04 DOTA
Python学习小技巧之利用字典的默认行为
2017/05/20 Python
浅谈Matplotlib简介和pyplot的简单使用——文本标注和箭头
2018/01/09 Python
Python自定义线程类简单示例
2018/03/23 Python
将python文件打包exe独立运行程序方法详解
2020/02/12 Python
Keras模型转成tensorflow的.pb操作
2020/07/06 Python
Python自动登录QQ的实现示例
2020/08/28 Python
H5仿微信界面教程(一)
2017/07/05 HTML / CSS
英国足球店:UK Soccer Shop
2017/11/19 全球购物
数学教学随笔感言
2014/02/17 职场文书
信用社主任竞聘演讲稿
2014/05/23 职场文书
应届大学生自荐书
2014/06/17 职场文书
工资收入证明
2014/10/07 职场文书
学生检讨书怎么写?
2014/10/10 职场文书
生产现场禁烟通知
2015/04/23 职场文书
红色电影观后感
2015/06/18 职场文书
Java 超详细讲解设计模式之中的抽象工厂模式
2022/03/25 Java/Android