jQuery değil saf JavaScript

Question

yılında

nasıl saf JavaScript ... ...

$(".hover").not(".selected"); 

aşağıdaki jQuery değil yazabilirim? sınıf seçimleri bu tür gerekiyorsa

Answer 1

allItems = document.getElementsByTagName('*'); 
goodItems = []; 
for(i=0;i<allItems.length;i++){ 
    if(
     allItems[i].className && 
     (' '+allItems[i].className.replace(/\s+/g, ' ')+' ').indexOf(' '+'hover'+' ') != -1 && 
     (' '+allItems[i].className.replace(/\s+/g, ' ')+' ').indexOf(' '+'selected'+' ') == -1 
    ) 
     goodItems.push(allItems[i]); 
} 

sıklıkla Ayrıca çalışması için aşağıdaki kullanabilirsiniz fonksiyonları olarak kaydederek hatta jQuery davranış bazı $(".hover").not(".selected");

Answer 2

gibi şeyler yapabilmek için kopyalayan düşünmelisiniz öğeleri sınıf adına göre al.

excludeClass isteğe bağlı bir parametredir, bu işlev yalnızca includeClass parametresini tanımladığınızda çalışmaya devam edecektir.

function getElementsByClassName(includeClass, excludeClass) { 
    var elements = []; var el = document.getElementsByTagName('*'); 
    var regexp1 = new RegExp("\\b" + includeClass + "\\b"); 
    var regexp2 = new RegExp("\\b" + (excludeClass ? excludeClass : "") + "\\b"); 
    for (var i = 0; i < el.length; i++) { 
     if (regexp1.test(el[i].className) && !regexp2.test(el[i].className)) { elements.push(el[i]); } 
    } 
    return elements; 
} 

Answer 3

Aşağıdakiler işe yarar. Listenin sadece "vurgulu" sınıfına sahip öğelere filtre uygulanabilmesi için mevcut bir yerel tarayıcı uygulaması olan getElementsByClassName() kullanılarak optimize edilebilir.

function hasClass(el, cssClass) { 
    return el.className && new RegExp("(^|\\s)" + cssClass + "(\\s|$)").test(el.className); 
} 

var matchingElements = []; 
var allElements = document.getElementsByTagName("*"); 
for (var i = 0, len = allElements.length, el; i < len; ++i) { 
    el = allElements[i]; 
    if (hasClass(el, "hover") && !hasClass(el, "selected")) { 
     matchingElements.push(el); 
    } 
}