classlist.toggle javascript code example
Example 1: toggle css class in javascript
.getElementById();
.classList.toggle();
Example 2: classname toggle js
document.getElementById('myButton').onclick = function() {
this.classList.toggle('active');
}
Example 3: js classlist
classList.item(index);
classList.contains(token);
classList.add(token1[, ...tokenN]);
classList.remove(token1[, ...tokenN]);
classList.replace(oldToken, newToken);
classList.supports(token);
classList.toggle(token[, force]);
classList.entries();
classList.forEach(callback[ ,thisArg]);
classList.keys();
classList.values();
Example 4: toggle class javascript
var menu = document.querySelector('.menu')
menu.classList.toggle('hidden-phone');
Example 5: how to get a toggle button to do different js functions
var clicked = false;
function toggleBtnClick() {
var img = document.getElementById('baseImg');
if (clicked) {
img.src = 'http://via.placeholder.com/350x150/e9e9e9/000000';
clicked = false;
} else {
img.src = 'http://via.placeholder.com/350x150/3fafed/000000';
clicked = true;
}
}
Example 6: css class list
var myElement = document.getElementById("myElementID");
myElement.classList.add("style1 style2");
myElement.classList.remove("style1 style2");