关于firefox的ElementTraversal 接口使用说明

169 阅读 0 评论 112 点赞

我是靠谱客的博主高高黑米，最近开发中收集的这篇文章主要介绍关于firefox的ElementTraversal 接口使用说明，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

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; 
} 
} 