关于firefox的ElementTraversal 接口 使用说明


Posted in Javascript onNovember 11, 2010

firstElementChild
访问一元素的这个属性必须将该nodeType 1 元素第一子节点引用返回为 Element 对象。如果该被访问元素属性没有任何子节点,或者如果所有这些子节点都不是元素节点, 那么该属性必须返回 null。
lastElementChild
访问一元素的这个属性必须将该nodeType 1 元素最后子节点引用返回为 Element 对象。如果该被访问元素属性没有任何子节点,或者如果所有这些子节点都不是元素节点, 那么该属性必须返回 null。
previousElementSibling
访问一元素的这个属性必须将按文件顺序排在该元素之前属于nodeType 1 元素同级节点引用返回为 Element 对象。如果该被访问元素属性没有任何处于它之前的同级节点,或者如果所有这些同级节点都不是元素节点, 那么该属性必须返回 null。
nextElementSibling
访问一元素的这个属性必须将按文件顺序紧跟着这个属于nodeType 1 元素同级节点引用返回为 Element 对象。如果该被访问元素属性没有任何跟在它之后的同级节点,或者如果所有这些同级节点都不是元素节点, 那么该属性必须返回 null。
childElementCount
访问一元素的这个属性必须返回这个属于nodeType 1.元素子节点当前数目, 访问此属性时,执行可能存贮该数目,或可能计算该数目,但该数目必须始终代表访问该属性时子元素节点的数目。 只有直接子节点才应该计算在内,如被访问属性元素子节点之一又有元素子节点那么 这下一级的就不算。如果属性被访问的这个元素没有子节点,或者所有这些子节点都不是元素节点,那么这个属性必须返回0 。

function spaceChildren( el ) { 
// 求元素节点数目 
var elCount = el.childElementCount; var eachWidth = window.innerWidth / (elCount + 1); 
// 求第一子元素 
var childEl = el.firstElementChild; 
// 设置初始位置 
var nextPos = eachWidth/2; 
// 逐一循环子元素 
while ( childEl ) { 
// 放好子元素 
childEl.style.setProperty( 'position', 'absolute', '' ); 
childEl.style.setProperty( 'left', nextPos + 'px', '' ); 
childEl.style.setProperty( 'width', eachWidth + 'px', '' ); 
// 按宽度增距 
nextPos += eachWidth; 
// 然后导航到下一个子元素 
childEl = childEl.nextElementSibling; 
} 
}
Javascript 相关文章推荐
javascript简单实现表格行间隔显示颜色并高亮显示
Nov 29 Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 Javascript
javascript中字符串拼接详解
Sep 26 Javascript
基于jquery实现等比缩放图片
Dec 03 Javascript
jquery实现浮动在网页右下角的彩票开奖公告窗口代码
Sep 04 Javascript
Bootstrap基本样式学习笔记之标签(5)
Dec 07 Javascript
Iscrool下拉刷新功能实现方法(推荐)
Jun 26 Javascript
jquery写出PC端轮播图实例
Jan 26 jQuery
vue.js2.0 实现better-scroll的滚动效果实例详解
Aug 13 Javascript
解决vue 绑定对象内点击事件失效问题
Sep 05 Javascript
京东优选小程序的实现代码示例
Feb 25 Javascript
Webpack3+React16代码分割的实现
Mar 03 Javascript
将string解析为json的几种方式小结
Nov 11 #Javascript
js读取本地excel文档数据的代码
Nov 11 #Javascript
JS维吉尼亚密码算法实现代码
Nov 09 #Javascript
网易JS面试题与Javascript词法作用域说明
Nov 09 #Javascript
浅谈Javascript嵌套函数及闭包
Nov 09 #Javascript
JavaScript高级程序设计 扩展--关于动态原型
Nov 09 #Javascript
关于JavaScript定义类和对象的几种方式
Nov 09 #Javascript
You might like
使用Apache的rewrite技术
2006/06/22 PHP
PHP连接MySQL查询结果中文显示乱码解决方法
2013/10/25 PHP
PHP数组操作类实例
2015/07/11 PHP
jQuery实现弹出窗口中切换登录与注册表单
2015/06/05 Javascript
AngularJS+Node.js实现在线聊天室
2015/08/28 Javascript
深入理解AngularJS中的ng-bind-html指令和$sce服务
2016/09/08 Javascript
vue2.x select2 指令封装详解
2017/10/12 Javascript
详解Webpack实战之构建 Electron 应用
2017/12/25 Javascript
Vue使用枚举类型实现HTML下拉框步骤详解
2018/02/05 Javascript
vue-cli 构建骨架屏的方法示例
2018/11/08 Javascript
vue实现微信二次分享以及自定义分享的示例
2019/03/20 Javascript
聊聊鉴权那些事(推荐)
2019/08/22 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
2019/09/16 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
vue使用一些外部插件及样式的配置代码
2019/11/18 Javascript
[03:01]完美世界DOTA2联赛PWL S2 集锦第二期
2020/12/03 DOTA
Python多线程实例教程
2014/09/06 Python
基于Django用户认证系统详解
2018/02/21 Python
Sanic框架安装与简单入门示例
2018/07/16 Python
新手入门Python编程的8个实用建议
2019/07/12 Python
浅谈Python_Openpyxl使用(最全总结)
2019/09/05 Python
python打印文件的前几行或最后几行教程
2020/02/13 Python
Python xlrd/xlwt 创建excel文件及常用操作
2020/09/24 Python
基于python获取本地时间并转换时间戳和日期格式
2020/10/27 Python
Python基于tkinter canvas实现图片裁剪功能
2020/11/05 Python
Django使用django-simple-captcha做验证码的实现示例
2021/01/07 Python
芬兰设计商店美国:Finnish Design Shop US
2019/03/25 全球购物
万代美国官网:PREMIUM BANDAI USA
2020/09/11 全球购物
PHP如何删除一个Cookie值
2012/11/15 面试题
介绍一下gcc特性
2012/01/20 面试题
客户表扬信范文
2014/01/10 职场文书
中班上学期幼儿评语
2014/04/30 职场文书
项目投资合作意向书
2014/07/29 职场文书
银行求职信模板
2015/03/20 职场文书
2015秋季开学典礼新闻稿
2015/07/17 职场文书
nginx 配置缓存
2022/05/11 Servers