关于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 相关文章推荐
写入cookie的JavaScript代码库 cookieLibrary.js
Oct 24 Javascript
jquery的extend和fn.extend的使用说明
Jan 09 Javascript
js判断背景图片是否加载成功使用img的width实现
May 29 Javascript
javascript(js)的小数点乘法除法问题详解
Mar 07 Javascript
JS版的date函数(和PHP的date函数一样)
May 12 Javascript
JS实现弹性漂浮效果的广告代码
Sep 02 Javascript
JS实现兼容火狐及IE iframe onload属性的遮罩层隐藏及显示效果
Aug 23 Javascript
DropDownList实现可输入可选择(两种版本可选)
Dec 07 Javascript
Vue实现动态响应数据变化
Apr 28 Javascript
vue使用Axios做ajax请求详解
Jun 07 Javascript
redux中间件之redux-thunk的具体使用
Apr 17 Javascript
vue路由分文件拆分管理详解
Aug 13 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
德生H-501的评价与改造
2021/03/02 无线电
php 日期和时间的处理-郑阿奇(续)
2011/07/04 PHP
php笔记之:有规律大文件的读取与写入的分析
2013/04/26 PHP
PHP获取栏目的所有子级和孙级栏目的ID号示例
2014/04/01 PHP
CI框架实现优化文件上传及多文件上传的方法
2017/01/04 PHP
JS代码格式化和语法着色V2
2006/10/14 Javascript
解决Extjs上传图片无法预览的解决方法
2012/03/22 Javascript
来自国外的30个基于jquery的Web下拉菜单
2012/06/22 Javascript
JS实现图片横向滚动效果示例代码
2013/09/04 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
2013/11/12 Javascript
jQuery实现Div拖动+键盘控制综合效果的方法
2015/03/10 Javascript
js实现类似jquery里animate动画效果的方法
2015/04/10 Javascript
JS/Jquery判断对象为空的方法
2015/06/11 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
2016/02/06 Javascript
javascript每日必学之多态
2016/02/23 Javascript
浅析jquery与checkbox的checked属性的问题
2016/04/27 Javascript
JavaScript中数组的22种方法必学(推荐)
2016/07/20 Javascript
webpack引入eslint配置详解
2018/01/22 Javascript
npm的lock机制解析
2019/06/20 Javascript
基于JS实现table导出Excel并保留样式
2020/05/19 Javascript
VUE-ElementUI 自定义Loading图操作
2020/11/11 Javascript
[02:54]DOTA2英雄基础教程 撼地者
2014/01/14 DOTA
Python的动态重新封装的教程
2015/04/11 Python
Python下rrdtool模块的基本使用方法
2015/11/13 Python
Python连接数据库学习之DB-API详解
2017/02/07 Python
Collatz 序列、逗号代码、字符图网格实例
2017/06/22 Python
学习和使用python的13个理由
2019/07/30 Python
pygame库实现移动底座弹球小游戏
2020/04/14 Python
Pygame的程序开始示例代码
2020/05/07 Python
python如何提升爬虫效率
2020/09/27 Python
英国领先的酒类网上商城:TheDrinkShop
2017/03/16 全球购物
SKECHERS斯凯奇中国官网:来自美国的运动休闲品牌
2018/11/14 全球购物
铁路个人事迹材料
2014/01/30 职场文书
2015初中团支部工作总结
2015/07/21 职场文书
青年联谊会致辞
2015/07/31 职场文书
MySQL中日期型单行函数代码详解
2021/06/21 MySQL