技术开发 频道

Jquery技巧讲解:简化closest函数

  jQuery( selectors, context || this.context ) :

  0;

  
for ( i = 0, l = this.length; i < l; i++ ) {

  cur
= this[i];

  
while ( cur ) {

      if ( pos ? pos.index(cur) > -1 : jQuery.find.matchesSelector(cur, selectors) ) {

  ret.push( cur );

  break;

  }
else {

  cur
= cur.parentNode;

  
if ( !cur || !cur.ownerDocument || cur === context || cur.nodeType === 11 ) {

  break;

  }

  }

  }

  }

  ret
= ret.length > 1 ? jQuery.unique( ret ) : ret;

  return this.pushStack( ret,
"closest", selectors );

  },

恰逢我也想造个轮子,便去研究它一翻,发现其第一个可以是字符串,元素节点或jQuery对象,还有一个可选参数,上下文。看源码前几句,发现有个分支是判断是否是Array,估计是供内部调用的优化代码,可以无视之。于是其方法简化为:

closest: function( selectors, context ) {

  var ret
= [], i, l, cur = this[0];

  
// 如果字符串包含位置伪类或者是个元素节点,则封装为一个jQuery对象,否则为0(即false的简写,用于快速跳过分支)

  var pos
= POS.test( selectors ) || typeof selectors !== "string" ?

  jQuery( selectors, context || this.context ) :

  
0;

  
//遍历原jQuery对象的节点

  
for ( i = 0, l = this.length; i < l; i++ ) {

  cur
= this[i];

  
while ( cur ) {

  
//如果是jQuery对象,则判定其是否包含当前节点,否则使用matchesSelector方法判定这个节点是否匹配给定的表达式selectors

  
if ( pos ? pos.index(cur) > -1 : jQuery.find.matchesSelector(cur, selectors) ) {

 

0
相关文章