javascript遍历子元素

    最近写代码时需要获取符合某些条件的节点子元素,用firstChild之类的方法会包含文本节点,所以包装了一个简单的类:

 1     //子元素遍历器

 2     function ElementWalker(node) {

 3         if(typeof node === 'string')

 4             node = document.getElementById(node);

 5         this.node = node;

 6     }

 7     ElementWalker.prototype = {

 8         //获取第一个指定tagName的子元素,如果tagName没定义,则返回第一个子元素

 9         first: function(tagName) {

10             if((typeof tagName === 'undefined') && this.node.firstElementChild) {

11                 return new ElementWalker(this.node.firstElementChild);

12             }

13             for(i = 0; i < this.node.childNodes.length; i++) {

14                 if(this.checkChild(i,tagName)) {

15                     return new ElementWalker(child);

16                 }

17             }

18         },

19         //获取最后一个指定tagName的子元素,如果tagName没定义,则返回最后一个子元素

20         last: function(tagName) {

21             if((typeof tagName === 'undefined') && this.node.lastElementChild) {

22                 return new ElementWalker(this.node.lastElementChild);

23             }

24             for(i = parent.childNodes.length - 1; i >= 0; i--) {

25                 var child = this.node.childNodes[i];

26                 if(this.checkChild(child,tagName)) {

27                     return new ElementWalker(child);

28                 }

29             }            

30         },

31         //返回所有指定tagName的子元素,如果tagName没定义,则返回所有子元素

32         all: function(tagName) {

33             var children = [];

34             for(i = 0; i < this.node.childNodes.length; i++) {

35                 var child = this.node.childNodes[i];

36                 if(this.checkChild(child,tagName)) {

37                     children.push(new ElementWalker(child));

38                 }

39             }

40             return children;

41         },

42         //校验child是否是指定tagName的元素

43         checkChild : function(child,tagName) {

44             var isOK = (typeof tagName === 'undefined') && child.nodeType == 1;

45             isOK = isOK || (child.tagName && child.tagName.toLowerCase() === tagName);

46             return isOK;

47         }

48     }

 

你可能感兴趣的:(JavaScript)