2014-05-09 36 views
6

Tek bir sınıfı birden çok sınıftan seçilmiş öğeye nasıl ekleyebilirim/kaldırabilirim.JavaScript: Birden çok öğe için tek bir sınıf ekle/kaldır

var classOne = document.querySelector(".class1"); 
var classTwo = document.querySelector(".class2"); 
var classThree = document.querySelector(".class3"); 
var classFour = document.querySelector(".class4"); 

ama ben de böyle bir şey yapmaya çalışıyorum: Bazı değişkenler için önbelleğe sahip benim kurulumda

her şeyi yapmaz

var allClasses = [classOne, classTwo, classThree, classFour]; 

allClasses.classList.add("active"); 
allClasses.classList.remove("active"); 

görünmüyor Yine de çalışıyor olmak.

Hayır jQuery lütfen.

+0

size yardımcı olacak http://stackoverflow.com/questions/2155737/remove-css-class-from-element-with-javascript-no-jquery –

+0

Dikkat edilmesi gereken birkaç şey: 'classList' IE8 veya IE9'da desteklenmez. (Yine de [shimmed] (https://github.com/remy/polyfills/blob/master/classList.js) olabilir.) Ayrıca, 'querySelector', DOM'daki ** ilk ** eşleşen elemanı bulur. –

cevap

5

bu deneyin:

Belki
var classOne = document.querySelector(".class1"); 
var classTwo = document.querySelector(".class2"); 
var classThree = document.querySelector(".class3"); 
var classFour = document.querySelector(".class4"); 

var allClasses = [classOne, classTwo, classThree, classFour]; 

allClasses.forEach(function(el) { 
    el.classList.add("active") 
}) 
+0

iyi çalıştı. Teşekkürler. BTW el ne anlama geliyor? – user3143218

+1

@ user3143218: Muhtemelen "el", "dizi öğesi" veya "DOM öğesi" anlamına gelmesi için "öğe" aldığınızdan, dizideki öğe anlamına gelir. :-) –

+1

Array.prototype.forEach, bulunduğu dizinin değerinden geçer. Bu durumda hangi unsurlar olacak. @ T.J.Crowder DOM öğeleri için gidiyordum ama iyi nokta :) – bottens

İlgili konular