2016-03-31 28 views
1

Benim için jQuery'den kullandığım şeyleri, benim için jQuery benzeri bir yardımcı program kitaplığı oluşturmaya çalışıyorum.iterator öğesinde return element.parentNode

Aşağıdaki kod var: Ben döngü trought öğeler saldırması ve daha sonra element.parentNode dönmek ediyorum

function jLib(selector) { 

    this.elements = selector.nodeType ? [ selector ] : document.querySelectorAll(selector); 


    this.each = function(cb) { 
    for(var i = 0; i < this.elements.length; i++) {   
     var el = this.elements[i]; 
     cb.call(this, el); 
    } 
    }; 


    this.parent = function() { 
    this.each(function(element) { 
     return element.parentNode; 
    }); 
    }; 

    this.addClass = function(className) { 

     this.each(function(element) { 
      className.split(' ').forEach(function(_className) { 
       element.classList.add(_className); 
      }); 
     }); 

     return this; 
    }; 

} 


new jLib('.has_parrent').parent().addClass('border'); 

ancak beklenen işlev çıkış olarak ne zaman ilk getiri.

Birisi bana açıklayabilir, lütfen öğenin ebeveyni nasıl gönderirim, böylece kütüphanemdeki diğer yöntemlere erişebilir miyim?

new jLib('.has_parrent').parent().addClass('border'); 
+1

gibi parent() dönüşü ebeveyn elemanlarını içeren yeni jLib nesne yapmak gerekir. – Bergi

+0

"* olduğu gibi *" ??? – Bergi

+0

bekleniyor, tahminim –

cevap

2

yerine ona bir bağlantı söz konusu kodunuzu gönderilmesi için lütfen

function isArray(obj) { 
 
    return Array.isArray(obj); 
 
} 
 

 
function jLib(selector) { 
 
    this.elements = selector.nodeType ? [selector] : (isArray(selector) ? selector : document.querySelectorAll(selector)); 
 

 

 
    this.each = function(cb) { 
 
    for (var i = 0; i < this.elements.length; i++) { 
 
     var el = this.elements[i]; 
 
     cb.call(this, el); 
 
    } 
 
    }; 
 

 

 
    this.parent = function() { 
 
    var els = [].map.call(this.elements, function(element) { 
 
     return element.parentNode; 
 
    }); 
 

 
    return new jLib(els); 
 
    }; 
 

 
    this.addClass = function(className) { 
 

 
    this.each(function(element) { 
 
     className.split(' ').forEach(function(_className) { 
 
     element.classList.add(_className); 
 
     }); 
 
    }); 
 

 
    return this; 
 
    }; 
 

 
} 
 

 

 
new jLib('.has_parrent').parent().addClass('border');
.border { 
 
    border: 1px solid red; 
 
    margin-bottom: 5px; 
 
}
<div class="parent"> 
 
    <div class="has_parrent">has parrent</div> 
 
</div> 
 

 
<div class="parent parent-2"> 
 
    <div class="has_parrent">has parrent</div> 
 
</div>

+1

https://jsfiddle.net/arunpjohny/2gs8bp5e/ –

+0

Protip: 'Array.isArray' :-) – Bergi

+0

@ Burgi teşekkürler :) –