W3.JS Agregar clases a HTML

❮ Anterior Próximo ❯

Añadir una clase:

w3.addClass(selector,'class')

Añadir varias clases:

w3.addClass(selector,'class1 class2 class3...')

Añadir clase por ID

Agregue la clase "marcada" a un elemento con id="London":

Ejemplo

<button onclick="w3.addClass('#London','marked')">Add Class</button>

Agregar clase por etiqueta

Agregue la clase "marcada" a todos los elementos <h2>:

Ejemplo

<button onclick="w3.addClass('h2','marked')">Add Class</button>

Agregar clase por clase

Agrega la clase "marcada" a un elemento con class="city":

Ejemplo

<button onclick="w3.addClass('.city','marked')">Add Class</button>

Agregar varias clases

Para agregar varias clases a un elemento, separe cada clase con un espacio.

Agregue "clase1" y "clase2" a un elemento con id="London":

Ejemplo

<button onclick="w3.addClass('#London','class1 class2')">Add Classes</button>

Eliminar clases de elementos HTML

Eliminar una clase:

w3.removeClass(selector,'class')

Eliminar varias clases:

w3.removeClass(selector,'class1 class2 class3...')

Quitar clase por ID

Elimina la clase "marcada" de un elemento con id="London":

Ejemplo

<button onclick="w3.removeClass('#London','marked')">Remove Class</button>

Eliminar clase por etiqueta

Elimina la clase "marcada" de todos los elementos <h2>:

Ejemplo

<button onclick="w3.removeClass('h2','marked')">Remove Class</button>

Quitar clase por clase

Elimina la clase "marcada" de todos los elementos con class="city":

Ejemplo

<button onclick="w3.removeClass('.city','marked')">Remove Class</button>

Eliminar varias clases

Para eliminar varias clases de un elemento, separe cada clase con un espacio.

Elimina tanto "class1" como "class2" de un elemento con id="London":

Ejemplo

<button onclick="w3.removeClass('#London','class1 class2')">Remove Classes</button>

Alternar la clase de elementos HTML

Alternar una clase (activar/desactivar):

w3.toggleClass(selector,'class')

Alternar entre dos clases:

w3.toggleClass(selector,'property','class','class')

Alternar clase por ID

Alterne entre la clase "marcada" de un elemento con id="London":

Ejemplo

<button onclick="w3.toggleClass('#London','marked')">Toggle</button>

Alternar clase por etiqueta

Alterne entre la clase "marcada" de todos los elementos <h2>:

Ejemplo

<button onclick="w3.toggleClass('h2','marked')">Toggle</button>

Alternar clase por clase

Alterne entre la clase "marcada" de todos los elementos con class="city":

Ejemplo

<button onclick="w3.toggleClass('.city','marked')">Toggle</button>

Alternar varias clases

Alterne entre el nombre de clase "clase1" y "clase2" de id="London:

Ejemplo

<button onclick="w3.toggleClass('#London','class1','class2')">Toggle</button>

❮ Anterior Próximo ❯