Pridávanie, prepínanie a odoberanie classov

Efektívnejšie ako nastavovanie display hide a display block je nastavenie prepínača classu:
element.classList.toggle(“hide”)

element.classList.toggle("hide") // prepinanie classov
element.classList.remove("hide") // odobratie
element.classList.add("hide")    // pridanie

Funkcia v praxi s onclick:

document.getElementById("wi_as_company").onclick = function() {
   document.querySelector(".oznam-pokladna").classList.toggle("hide")
}
alebo
document.getElementById("wi_as_company").onclick = function() { myFunction() }

Ďalší príklad s listenerom change, podmienka by tam v skutočnosti nemusela byť ale môže sa zísť v niektorých prípadoch

document.getElementById("wi_as_company").addEventListener("change", function(){ 
   document.getElementById("wi_as_company").checked==false? document.querySelector(".oznam-pokladna").classList.add("hide") :  document.querySelector(".oznam-pokladna").classList.remove("hide")
})
toogle class js

Pridaj komentár

Vaša e-mailová adresa nebude zverejnená.