En el pasado, necesitábamos usar algunos métodos de JS o jQuery, HaClass, AddClass y Eliminar. molesto.
La nueva lista de clases de H5 nos permite operar el nombre de categoría de nuestros elementos más convenientes.
AvisoLa compatibilidad de la lista de clases es algo pobre, no compatible con el navegador IE debajo de IE10.
Ejemplo ejemplar
<! Font-size: 25px;} </ystye> </head> <body> <p> Haga clic en el botón para agregar la clase MyStyle al elemento DIV. </p> <button onClick = myFunction ()> Haga clic en mí </botón> <div id = myDiv> Soy un elemento div. </div> <script> function myFunction () {document.getElementById (myDiv) .classList.Add (mystyle);} </script> </body> </html> Nueva categoríaUsando el método Agregar, puede agregar una o más categorías al elemento de página:
document.getElementById (myDiv) .classList.add (mystyle);Eliminar una clase
Con el método eliminar, puede eliminar una sola clase CSS:
document.getElementById (myDiv) .classList.remove (mystyle);Cambiar el nombre de la categoría en elementos
Cambiar nombres de categoría en elementos. Use el método de alternancia, gramática: toggle (clase, verdadero | falso)
El primer parámetro es el nombre de clase que se eliminará en el elemento y devuelve falso.
Si el nombre no existe, el nombre de la clase se agregará al elemento y devuelve verdadero.
El segundo son los parámetros opcionales. Por ejemplo:
Eliminar uno
document.getElementById (myDiv) .classList.toggle (Classtoremove, falso);
Agregar uno
document.getElementById (myDiv) .classList.toggle (Classtoadd, true);
Nota: Internet Explorer u Opera 12 y sus versiones anteriores no admiten el segundo parámetro
Compruebe si contiene una determinada claseUse el método Contiene para determinar si existe una clase y volver al valor booleano.
// devuelve el documento verdadero o falso .getElementById (myDiv) .classList.contains (myDiv);
Lo anterior es todo el contenido de este artículo.