关于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 相关文章推荐
js模拟类继承小例子
Jul 17 Javascript
从URL中提取参数与将对象转换为URL查询参数的实现代码
Jan 12 Javascript
JSON辅助格式化处理方法
Mar 26 Javascript
IE与FF下javascript获取网页及窗口大小的区别详解
Jan 14 Javascript
JavaScript基础知识学习笔记
Dec 02 Javascript
45个JavaScript编程注意事项、技巧大全
Feb 11 Javascript
js判断手机号运营商的方法
Oct 23 Javascript
JS简单编号生成器实现方法(附demo源码下载)
Apr 05 Javascript
使用伪命名空间封装保护独自创建的对象方法
Aug 04 Javascript
Bootstrap基本组件学习笔记之下拉菜单(7)
Dec 07 Javascript
Vue.js学习笔记之修饰符详解
Jul 25 Javascript
vue 在methods中调用mounted的实现操作
Aug 07 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
PHP 编程的 5个良好习惯
2009/02/20 PHP
php MYSQL 数据备份类
2009/06/19 PHP
CakePHP框架Model关联对象用法分析
2017/08/04 PHP
php常用字符串查找函数strstr()与strpos()实例分析
2019/06/21 PHP
jQuery DOM操作实例
2014/03/05 Javascript
Jquery easyUI 更新行示例
2014/03/06 Javascript
javaScript如何处理从java后台返回的list
2014/04/24 Javascript
深入理解JavaScript系列(50):Function模式(下篇)
2015/03/04 Javascript
javascript操作表格排序实例分析
2015/05/06 Javascript
JQuery中上下文选择器实现方法
2015/05/18 Javascript
Bootstrap4一次重大更新 几乎涉及每行代码
2016/05/16 Javascript
JS实现图片放大镜插件详解
2017/11/06 Javascript
浅谈Node.js CVE-2017-14849 漏洞分析(详细步骤)
2017/11/10 Javascript
360doc网站不登录就无法复制内容的解决方法
2018/01/27 Javascript
js自定义trim函数实现删除两端空格功能
2018/02/09 Javascript
Vue2.0实现组件数据的双向绑定问题
2018/03/06 Javascript
vue-infinite-loading2.0 中文文档详解
2018/04/08 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
python XlsxWriter模块创建aexcel表格的实例讲解
2018/05/03 Python
python处理csv中的空值方法
2018/06/22 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
Python列表删除元素del、pop()和remove()的区别小结
2019/09/11 Python
Python vtk读取并显示dicom文件示例
2020/01/13 Python
Python类继承和多态原理解析
2020/02/05 Python
简单了解Python字典copy与赋值的区别
2020/09/16 Python
Python扫描端口的实现
2021/01/25 Python
CSS的pointer-events属性详细介绍(作用和注意事项)
2014/04/23 HTML / CSS
HTML5 使用 sessionStorage 进行页面传值的方法
2018/07/02 HTML / CSS
泰坦健身器材:Titan Fitness
2018/02/13 全球购物
波兰最早的运动鞋精品店之一:Street Supply
2019/08/29 全球购物
伊莱克斯(Electrolux)俄罗斯网上商店:瑞典家用电器品牌
2021/01/23 全球购物
大学生饮食配送创业计划书
2014/01/04 职场文书
优秀民警事迹材料
2014/01/29 职场文书
护理学院专科毕业生求职信
2014/06/28 职场文书
青年干部培训班学习心得体会
2016/01/06 职场文书
Python基础之函数嵌套知识总结
2021/05/23 Python