javascript 节点遍历函数

火狐官网上找到的一组函数，相当于treeWalker，有了它可以方便地在IE实现Traversal API 2的所有功能（nextElementSibling，previousElementSibling，firstElementChild，lastElementChild，children）These functions let you find the next sibling, previous sibling, first child, and last child of a given node (element). What makes them unique is that they safely ignore whitespace nodes so you get the real node you're looking for each time.


代码如下:

function is_all_ws(nod) { return !(/[^\t\n\r ]/.test(nod.data)); }
function is_ignorable(nod) { return (nod.nodeType == 8) || ((nod.nodeType == 3) && is_all_ws(nod)); }
function node_before(sib) {
while ((sib = sib.previousSibling)) {
if (!is_ignorable(sib)) return sib;
}
return null;
}
function node_after(sib) {
while ((sib = sib.nextSibling)) {
if (!is_ignorable(sib)) return sib;
}
return null;
}
function first_child(par) {
var res = par.firstChild;
while(res) {
if(!is_ignorable(res)) return res;
res = res.nextSibling;
}
return null;
}
function last_child(par) {
var res = par.lastChild;
while(res) {
if(!is_ignorable(res)) return res;
res = res.previousSibling;
}
return null;
}

赞 (0)

相关推荐

  • javascript 节点遍历函数

    火狐官网上找到的一组函数,相当于treeWalker,有了它可以方便地在IE实现Traversal API 2的所有功能(nextElementSibling,previousElementSibling,firstElementChild,lastElementChild,children)These functions let you find the next sibling, previous sibling, first child, and last child of a given

  • JavaScript forEach()遍历函数使用及介绍

    forEach()函数从头到尾把数组遍历一遍.有三个参数分别是:数组元素,元素的索引,数组本身(如果是一个参数就是数组元素,也就是数组的值. var data=[1,2,3,4,5,6]; var sum=0; data.forEach(function(v){//其中的v就是数组的值 123456 sum+=v;}) document.write(sum+"<br>");//打印出来是21 data.forEach(function(o,p,q){//分别对应:数组元素,

  • Jquery节点遍历next与nextAll方法使用示例

    Jqeruy节点遍历 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title

  • 浅析jQuery 遍历函数，javascript中的each遍历

    jQuery 遍历函数 jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函数 描述 .add() 将元素添加到匹配元素的集合中. .andSelf() 把堆栈中之前的元素集添加到当前集合中. .children() 获得匹配元素集合中每个元素的所有子元素. .closest() 从元素本身开始,逐级向上级元素匹配,并返回最先匹配的祖先元素. .contents() 获得匹配元素集合中每个元素的子元素,包括文本和注释节点. .each() 对 jQuery 对象进行迭代,为每个匹配元

  • jQuery 遍历函数详解

    jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函数 描述 .add() 将元素添加到匹配元素的集合中. .andSelf() 把堆栈中之前的元素集添加到当前集合中. .children() 获得匹配元素集合中每个元素的所有子元素. .closest() 从元素本身开始,逐级向上级元素匹配,并返回最先匹配的祖先元素. .contents() 获得匹配元素集合中每个元素的子元素,包括文本和注释节点. .each() 对 jQuery 对象进行迭代,为每个匹配元素执行函数. .end(

  • JavaScript变速动画函数封装添加任意多个属性

    下面通过实例代码给大家介绍JavaScript变速动画函数封装添加任意多个属性 ,具体代码如下所示: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } div { width: 200px; height

  • JavaScript循环遍历的24个方法,你都知道吗

    JavaScript循环遍历的24个方法,你都知道吗

    目录 前言 一.数组遍历方法 1. forEach() 2. map() 3. for of 4. filter() 5. some().every() 6. reduce().reduceRight() 7. find().findIndex() 8. keys().values().entries() 二.对象遍历方法 1. for in 2. Object.keys().Object.values().Object.entries() 3. Object.getOwnPropertyNam

  • JavaScript装饰器函数(Decorator)实例详解

    JavaScript装饰器函数(Decorator)实例详解

    本文实例讲述了JavaScript装饰器函数(Decorator).分享给大家供大家参考,具体如下: 装饰器函数(Decorator)用于给对象在运行期间动态的增加某个功能,职责等.相较通过继承的方式来扩充对象的功能,装饰器显得更加灵活,首先,我们可以动态给对象选定某个装饰器,而不用hardcore继承对象来实现某个功能点.其次:继承的方式可能会导致子类繁多,仅仅为了增加某一个单一的功能点,显得有些多余了. 下面给出几个常用的装饰器函数示例,相关代码请查看github. 1 动态添加onload

  • JavaScript基于自定义函数判断变量类型的实现方法

    本文实例讲述了JavaScript基于自定义函数判断变量类型的实现方法.分享给大家供大家参考,具体如下: 通常用typeof来判断js变量的类型,但很多时候仅仅typeof满足不了要求的. 我写了一个自定义函数来做这个事,判断的比较全面了. function varType(v){ if ( typeof v=== "object" ){ if (v=== null ) return 'null' ; if (v. constructor ) return (v. constructo

  • javascript实现根据函数名称字符串动态执行函数的方法示例

    本文实例讲述了javascript实现根据函数名称字符串动态执行函数的方法.分享给大家供大家参考,具体如下: <script> //动态函数调用,调用者使用"targetFunction" function targetFunction() { alert(11111); return 9; } test("myFunc"); function test(funcName) { if(typeof(eval(funcName)) == "fun

随机推荐