关于获取子节点中的first|last等api探究

写于2012-4-2 清明假期的第一天 | @****

 

前言

 

      本文探究的是tangram中处理父节点寻找子节点中第一个(first)元素 | 最后一个(last)元素,以及子节点中的前一个(prev)元素 | 后一个(next)元素。

 

正文

 

在tangram的api设计中,抽离了一个接口式的api。

 

 

/*
*_matchNode 分类出来的一个公用的api---从目标元素指定的方向去找对应元素*
*@function*
*@param {String} direction -- 遍历的方向 previousSibling | nextSibling*
*@param {String} start -- 遍历开始的位置 firstChild | lastChild | previousSibling | nextSibling*
*/
ZYC.dom._matchNode = function(element,direction,start){
    element = ZYC.dom.g(element);
	for(var node = element[start];node;node=node[direction]){
	   if(node.nodeType == 1){
	      return node;
	   }
	}
};

 

1、first -- 获取子元素中的第一个元素节点

 

    思路其实就是循环从元素的firstChild开始, 遍历的方向是nextSibling

 

 

 

ZYC.dom.first = function(element){
    return ZYC.dom._matchNode(element,'nextSibling','firstChild');
};

 

2、last -- 获取子元素中的最后一个元素节点

 

    思路其实就是循环从元素的lastChild开始, 遍历的方向是previousSibling

 

 

ZYC.dom.last = function(element){
    return ZYC.dom._matchNode(element,'previousSibling','lastChild');
};

 

3、prev -- 获取前一个元素节点

 

   思路其实就是循环从该元素的previousSibling开始, 遍历的方向是previousSibling

 

 

ZYC.dom.prev = function(element){
    return ZYC.dom._matchNode(element,'previousSibling','previousSibling');
};

 

4、next -- 获取后一个元素节点

 

  思路其实就是循环从该元素的nextSibling开始, 遍历的方向是nextSibling

 

 

ZYC.dom.next = function(element){
    return ZYC.dom._matchNode(element,'nextSibling','nextSibling');
};
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值