Estilización con clases en JavaScript
Estilizar elementos a través del atributo style
a veces es conveniente, pero la mayoría de las veces no es la
mejor idea. El problema es que los estilos
estarán dispersos por el archivo JavaScript
y será laborioso cambiarlos.
Es mucho más conveniente definir estilos en archivos CSS
para que se puedan cambiar fácilmente,
sin tener que buscar en el código JavaScript.
Por ejemplo, supongamos que tenemos un elemento que muestra un mensaje. El mensaje puede ser "bueno" y mostrarse en color verde, o "malo" y mostrarse en color rojo. La mejor solución en este caso sería crear las correspondientes clases CSS:
.success {
color: green;
}
.error {
color: red;
}
Ahora, al mostrar un mensaje "bueno", le daremos al elemento la clase "buena":
elem.textContent = 'good';
elem.classList.add('success');
Y al mostrar un mensaje "malo", le daremos al elemento la clase "mala":
elem.textContent = 'bad';
elem.classList.add('error');
Se dan párrafos con números. Recorra estos párrafos con un ciclo y los párrafos que contienen números pares, colórelos en rojo, y los que contienen números impares - en verde.
