No passado, precisávamos usar alguns métodos de js ou jQuery, hasclass, addclass e removeclass. problemático.
A nova lista de classe do H5 nos permite operar o nome da categoria de nossos elementos mais convenientes.
PerceberA compatibilidade da lista de classe é um pouco ruim, não é compatível com o navegador do IE abaixo do IE10.
Exemplo exemplar
<! Size de fonte: 25px;} </style> </head> <body> <p> Clique no botão para adicionar a classe Mystyle ao elemento div. </p> <botão onclick = myfunction ()> clique em mim </butut> <div id = mydiv> eu sou um elemento div. </div> <cript> function myfunction () {document.getElementById (mydiv) .classList.add (mystyle);} </script> </body> </html> Nova categoriaUsando o método ADD, você pode adicionar uma ou mais categorias ao elemento da página:
document.getElementById (mydiv) .classList.add (mystyle);Exclua uma aula
Com o método Remover, você pode excluir uma única classe CSS:
document.getElementById (mydiv) .classList.remove (mystyle);Nome da categoria de mudança em elementos
Nomes da categoria de mudança nos elementos. Use o método de alternância, gramática: alterna (classe, true | false)
O primeiro parâmetro é o nome da classe a ser removido no elemento e retorna false.
Se o nome não existir, o nome da classe será adicionado ao elemento e retornará true.
O segundo são parâmetros opcionais. Por exemplo:
Remova um
document.getElementById (mydiv) .classList.toggle (classtoremove, false);
Adicione um
document.getElementById (mydiv) .classList.toggle (classtoadd, true);
Nota: Internet Explorer ou Opera 12 e suas versões anteriores não suportam o segundo parâmetro
Verifique se ele contém uma determinada classeUse o método contém para determinar se existe uma classe e retorne ao valor booleano.
// retorna true ou false document.getElementById (mydiv) .classList.contains (myDiv);
O acima é todo o conteúdo deste artigo.