В прошлом нам нужно было использовать некоторые методы JS или JQUERY, HASCLASS, ADDCLASS и REMOVECLASS. неприятный.
New ClassList H5 позволяет нам использовать название категории наших более удобных элементов.
УведомлениеСовместимость ClassList несколько плохая, не совместима с браузером IE ниже IE10.
Примерный пример
<! Размер шрифта: 25px;} </style> </head> <body> <p> Нажмите кнопку, чтобы добавить класс MyStyle в элемент DIV. </p> <button onclick = myfunction ()> Нажмите меня </button> <div id = mydiv> я являюсь элементом Div. </div> <script> function myfunction () {document.getElementByid (myDiv) .classlist.Add (myStyle);} </script> </body> </html> Новая категорияИспользуя метод добавления, вы можете добавить одну или несколько категорий в элемент страницы:
document.getElementById (myDiv) .classlist.add (мистиль);Удалить класс
С помощью метода удаления вы можете удалить один класс CSS:
document.getElementbyId (myDiv) .classlist.remove (myStyle);Название категории переключения в элементах
Названия категорий переключения в элементах. Используйте метод переключения, грамматика: переключать (класс, верно | false)
Первый параметр - это имя класса, которое будет удалено в элементе, и возвращает false.
Если имя не существует, имя класса будет добавлено в элемент и возвращает true.
Второе - дополнительные параметры. Например:
Удалить один
document.getElementById (myDiv) .classlist.toggle (classtoremove, false);
Добавить один
document.getElementbyId (myDiv) .classlist.toggle (classtoadd, true);
Примечание: Internet Explorer или Opera 12 и его более ранние версии не поддерживают второй параметр
Проверьте, содержит ли он определенный классИспользуйте метод содержимого, чтобы определить, существует ли класс, и вернуться к логическому значению.
// вернуть true или false Document.getElementById (myDiv) .classlist.contains (mydiv);
Выше всего содержимое этой статьи.