Wie Klasse für div mit js wechseln?

-5

Ich habe dies mit jquery getan, kann es aber nicht mit js tun.Wie Klasse für div mit js wechseln?

Blick auf mein Code:

https: // jsfiddle. net/88pd6zj0/

Es funktioniert nur mit der ersten Klasse = "html", aber nicht mit anderen arbeiten. Ich habe versucht, "querySelector" auf "querySelectorAll" ändern - und es funktioniert keine Klasse.

Wie behebt man dieses Problem? Danke.

Quelle

2017-04-01 Vladyslav Sharapat

Bearbeiten Sie die link pls .. und a dd der entsprechende Code auf die Frage –

https://jsfiddle.net/88pd6zj0/ –

Suraj bedeutete, dass Sie den Code, den Sie auf JSFiddle setzen müssen, und fügen Sie es zu Ihrer Frage mit einem [Bearbeiten]. – dorukayhan

Versuchen document.querySelectorAll()

var icon = document.querySelectorAll(".buttons div"); 
 
for(i =0;i<icon.length;i++){ 
 
icon[i].addEventListener("click", function(event){ 
 

 
\t event.preventDefault(); 
 
\t this.classList.add("active"); 
 
}); 
 
}

.html, .html5, .css{ 
 
\t width: 80px; 
 
\t height: 80px; 
 
\t border:1px dashed; 
 
    display:inline; 
 
    margin-left:10px; 
 
} 
 
.active{ 
 
    border:1px solid; 
 
}

<div class="buttons"> 
 
\t <div class="html "> 
 
\t <a href="#">HTML</a> 
 
\t </div> 
 
\t <div class="html5" > 
 
\t <a href="#">HTML 5</a> 
 
\t </div> 
 
\t <div class="css"> 
 
\t <a href="#">CSS 3</a> 
 
\t </div> 
 
</div>

Quelle

2017-04-01 12:37:33 Durga

Hier ist die Beispielklasse wechseln

var icon = document.querySelectorAll(".buttons div"); 
for (var i = 0; i < icon.length; i++) { 
    icon[i].addEventListener("click", function(event) { 
    event.preventDefault(); 
    if(this.className.includes("active")){ 
     this.classList.remove("active"); 
    } else {  
     this.classList.add("active"); 
    }  
    }); 
}

Hier ist die Arbeits jsfiddle: https://jsfiddle.net/88pd6zj0/3/

Quelle

2017-04-01 12:50:26 selvarajmas

Danke, aber wie Switch-Klassen - wenn wir ersten Knopf drücken - sollte solide Schaltfläche sein, wenn wir nächsten Knopf drücken - erste Klasse sollte gestrichelt und zweite solide sein. –

pls siehe die updated jsfiddle https://jsfiddle.net/88pd6zj0/3/ – selvarajmas

Wie Klasse für div mit js wechseln?

Antwort

Verwandte Themen