Saltar al contenido

Cómo agregar un nombre de clase

septiembre 29, 2021

Aprenda a agregar un nombre de clase a un elemento con JavaScript.


¡Haz clic en el botón para agregarme una clase!


Agregar clase

Paso 1) Agregar HTML:

Agregue un nombre de clase al elemento div con id = «myDIV» (en este ejemplo usamos un botón para agregar la clase).

Ejemplo

Intentalo


Este es un elemento DIV.

Paso 2) Agrega CSS:

Aplicar estilo al nombre de clase especificado:

Ejemplo

.mi estilo {
ancho: 100%;
relleno: 25px;
color de fondo: coral;
color blanco;
tamaño de fuente: 25px;
}



Paso 3) Agregar JavaScript:

Obtén el elemento

con id = «myDIV» y agrégale la clase «mystyle»:

Ejemplo

function myFunction () {
var element = document.getElementById («myDIV»);
element.classList.add («mystyle»);
}

Inténtalo tú mismo »


Propina: Consulte también Cómo alternar una clase.

Propina: Consulte también Cómo quitar una clase.

Propina: Obtenga más información sobre la propiedad classList en nuestra Referencia de JavaScript.

Propina: Obtenga más información sobre la propiedad className en nuestra Referencia de JavaScript.

close