Удалить класс у элемента на чистом javascript
чтобы пройтись по всему массиву , нужно точно указать его количество? как то так, например? [0-15] ? а если точное количество элементов не известно?
6 сен 2016 в 3:13
6 сен 2016 в 7:04
var pizza = document.getElementsByClassName('pizza')[0]; document.addEventListener('DOMContentLoaded', function() < var showPizza = document.getElementById('showPizza'); var pizza = document.getElementsByClassName('pizza')[0]; showPizza.addEventListener('click', function(e) < e.preventDefault(); console.log(pizza); pizza.classList.remove('hide'); >); console.log('get to the choppa. '); >); Pizza Time Отслеживать
ответ дан 5 сен 2016 в 10:53
22.4k 10 10 золотых знаков 56 56 серебряных знаков 119 119 бронзовых знаков
document.addEventListener('DOMContentLoaded', function() < document.getElementById('showPizza').addEventListener('click', function(e) < e.preventDefault(); document.getElementsByClassName('pizza')[0].className.remove('hide'); >); console.log('get to the choppa. '); >); Убрал переменные и всё заработало. Почему? А потому, что когда ты пишешь в переменную например:
var pizza = document.getElementsByClassName('pizza')[0]; то у тебя скрипт делает из pizza ссылку на
document.getElementsByClassName('pizza')[0] Обращаясь к pizza ты можешь редактировать то, на что pizza является ссылкой, то бишь скрипты: pizza.innerHTML и document.getElementsByClassName(‘pizza’)[0].innerHTML вернут идентичный результат.
UPD: Переменная showPizza у Вас определилась автоматически, т.к. вы дали элементу Можете смело обращаться к этой переменной без вызовов метода document.getElementById(. ).
Убираем класс с помощью classList.remove
Мы убедились, что JavaScript действительно нашёл элемент с классом page . Пора заняться переключением тем. У найденного элемента есть ещё второй класс — light-theme , благодаря ему на странице включена светлая тема. Чтобы не было смешения стилей, когда мы переключим тему, этот класс у элемента нужно убрать. Для этого нам понадобится метод classList.remove . Используют его так:
элемент.classList.remove('класс');Метод убирает с элемента тот класс, который указан в скобках. Обратите внимание, что мы не ставим точку перед именем класса в classList.remove . Это не селектор, JavaScript и так знает, что мы имеем дело с классом.
Обратите внимание, что буква «L» в названии метода заглавная. JavaScript чувствителен к регистру. Если написать classlist.remove , метод не сработает.
Чтобы выключить светлую тему, убрав класс light-theme у элемента page , используем инструкцию:
document.querySelector('.page').classList.remove('light-theme');Получился такой «паровозик»: найди элемент, а потом убери у него класс. Давайте посмотрим, что произойдёт, когда эта инструкция выполнится:
Давайте выключим светлую тему с помощью JavaScript!
Перейти к заданию
- index.html Сплит-режим
- style.css Сплит-режим
- script.js Сплит-режим
