classlist.toggle ejemplo de código javascript

Te damos la solución a este atasco, o por lo menos eso esperamos. Si sigues con alguna duda puedes escribirlo en el apartado de preguntas, para nosotros será un placer responderte

Ejemplo 1: alternar la clase css en javascript

/* var or const followed by its name */.getElementById(/* HTML element ID */);/* var or const's name */.classList.toggle(/* Name of CSS class */);// I hope this helps!

Ejemplo 2: nombre de clase toggle js

document.getElementById('myButton').onclick=function()this.classList.toggle('active');

Ejemplo 3: js classlist

classList.item(index);// Returns the item in the list by its index, or undefined if index is greater than or equal to the list's length
classList.contains(token);// Returns true if the list contains the given token, otherwise false.
classList.add(token1[,...tokenN]);// Adds the specified token(s) to the list.
classList.remove(token1[,...tokenN]);// Removes the specified token(s) from the list.
classList.replace(oldToken, newToken);// Replaces token with newToken.
classList.supports(token);// Returns true if a given token is in the associated attribute's supported tokens.
classList.toggle(token[, force]);// Removes token from the list if it exists, or adds token to the list if it doesn't. Returns a boolean indicating whether token is in the list after the operation.
classList.entries();// Returns an iterator, allowing you to go through all key/value pairs contained in this object.
classList.forEach(callback[,thisArg]);// Executes a provided callback function once per DOMTokenList element.
classList.keys();// Returns an iterator, allowing you to go through all keys of the key/value pairs contained in this object.
classList.values();// Returns an iterator, allowing you to go through all values of the key/value pairs contained in this object.

Ejemplo 4: alternar clase javascript

var menu =document.querySelector('.menu')// Using a class instead, see note below.
menu.classList.toggle('hidden-phone');

Ejemplo 5: cómo obtener un botón de alternancia para realizar diferentes funciones js

var clicked =false;functiontoggleBtnClick()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;

Ejemplo 6: lista de clases css

var myElement =document.getElementById("myElementID");
myElement.classList.add("style1 style2");
myElement.classList.remove("style1 style2");

Si te mola la idea, tienes el poder dejar una noticia acerca de qué te ha impresionado de esta noticia.

---

---

Utiliza Nuestro Buscador