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实现无刷新更新数据的详细步骤 asp
Dec 26 Javascript
jQuery 表单验证扩展(三)
Oct 20 Javascript
深入剖析JavaScript中的枚举功能
Mar 06 Javascript
jquery显示隐藏input对象
Jul 21 Javascript
使用微信小程序开发前端【快速入门】
Dec 05 Javascript
如何快速上手Vuex
Feb 14 Javascript
javascript编写简易计算器
May 06 Javascript
JS实现字符串中去除指定子字符串方法分析
May 17 Javascript
vue-lazyload使用总结(推荐)
Nov 01 Javascript
通过实例讲解JS如何防抖动
Jun 15 Javascript
小程序两种滚动公告栏的实现方法
Sep 17 Javascript
在vue中实现清除echarts上次保留的数据(亲测有效)
Sep 09 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
MySQL数据库转移,access,sql server 转 MySQL 的图文教程
2007/09/02 PHP
php在线生成ico文件的代码
2007/10/09 PHP
php下把数组保存为文件格式的实例应用
2010/02/08 PHP
php 操作数组(合并,拆分,追加,查找,删除等)
2012/07/20 PHP
PHP登录环节防止sql注入的方法浅析
2014/06/30 PHP
PHP获取数组长度或某个值出现次数的方法
2015/02/11 PHP
PHP的Socket通信之UDP通信实例
2015/07/02 PHP
FLASH 广告之外的链接
2008/12/16 Javascript
常见JS效果之图片减速度滚动实现代码
2011/12/08 Javascript
圣诞节Merry Christmas给博客添加浪漫的下雪效果基于jquery实现
2012/12/27 Javascript
自己编写的类似JS的trim方法
2013/10/09 Javascript
js实现的tab标签切换效果代码分享
2015/08/25 Javascript
jQuery Validate初步体验(一)
2015/12/12 Javascript
jQuery实现div横向拖拽排序的简单实例
2016/07/13 Javascript
微信小程序 网络API Websocket详解
2016/11/09 Javascript
vue + axios get下载文件功能
2019/09/25 Javascript
使用TS来编写express服务器的方法步骤
2020/10/29 Javascript
vue自定义插件封装,实现简易的elementUi的Message和MessageBox的示例
2020/11/20 Vue.js
Python随机生成手机号、数字的方法详解
2017/07/21 Python
Python实现简单http服务器
2018/04/12 Python
创建pycharm的自定义python模板方法
2018/05/23 Python
使用django自带的user做外键的方法
2020/11/30 Python
高清屏下canvas重置尺寸引发的问题的解决
2019/10/14 HTML / CSS
伦敦高级内衣品牌:Agent Provocateur(大内密探)
2016/08/23 全球购物
JD Sports法国:英国篮球和运动时尚的领导者
2017/09/28 全球购物
国家助学金获奖感言
2014/01/31 职场文书
网络信息安全承诺书
2014/03/26 职场文书
青年文明号服务承诺
2014/03/31 职场文书
2014年小学体育工作总结
2014/12/11 职场文书
爱岗敬业事迹材料
2014/12/24 职场文书
工作经验交流材料
2014/12/30 职场文书
2015年上半年党建工作总结
2015/03/30 职场文书
小学大队长竞选稿
2015/11/20 职场文书
导游词之西安大清真寺
2019/12/17 职场文书
(开源)微信小程序+mqtt,esp8266温湿度读取
2021/04/02 Javascript
十大公认最好看的动漫:《咒术回战》在榜,《钢之炼金术师》第一
2022/03/18 日漫