Cómo cambiar un atributo de clase CSS con Javascript

Cambiar el atributo de clase de un elemento HTML con JavaScript permite a los desarrolladores crear efectos interactivos en páginas web. Utilizando una función de JavaScript , puede determinar qué comportamiento debe tener lugar cuando los usuarios interactúan con los elementos de la página , alterando sus propiedades de estilo CSS , en respuesta a esta interacción. La alteración de los nombres de atributo de clase es una de las técnicas clave que participan en esta tarea , que es alcanzable incluso para las personas que empiezan en el desarrollo Web. Instrucciones
1

Crea tu página HTML con elementos para visualizar el contenido. Abra un nuevo archivo en un editor de texto y guárdelo con "html ". Como la extensión , entrando en el siguiente código:

< p > < /head>

Hello < /div >

< /body>

< /html >

Esto simplemente crea una página web con un solo elemento HTML en el mismo. El elemento tiene asignado el atributo de la clase con el nombre de "off ". Esto indica el estado del elemento cuando el usuario no tenga su cursor del ratón sobre él .
2

Crea tu código CSS. Abra un nuevo archivo en un editor de texto y guárdelo como " interactivestyle.css " para reflejar el propósito de la tarea a realizar. Escriba el siguiente código :

off {

color: # FF0000 ;}

sobre

{ color: # 0000FF ;} . .

Añadir un enlace a su archivo CSS en la sección de cabecera de su página HTML, entre la apertura y cierre de etiquetas de la cabeza :

Cree dos funciones JavaScript en la sección de cabecera de su página, ya sea antes o después de que el enlace a su archivo CSS :