Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.12.2018, 21:35
Кандидат Javascript-наук
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 116

добавление класс диву
Добры день всем не подскажите где в коде ошибка

document.getElementsByClassName("page").onclick = function() {
var element = document.getElementById("action");
element.classList.add("action-out");
};


при нажатье на любом из дивов класс page , в id action будет добавляться класс action-out

Последний раз редактировалось Hovik, 14.12.2018 в 22:14.
Ответить с цитированием
  #2 (permalink)  
Старый 14.12.2018, 22:31
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

Сообщение от Hovik
при нажатье на любом из дивов класс page , в id action будет добавляться класс action-out
Это как это?
У вас в коде ошибка в первой строке.
getElementsByClassName возвращает коллекцию элементов, а не конкретный элемент, поэтому назначение ей свойства onclick ничего не даст.
https://developer.mozilla.org/ru/doc...HTMLCollection
Ответить с цитированием
  #3 (permalink)  
Старый 14.12.2018, 22:44
Кандидат Javascript-наук
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 116

Да вы правы getElementsByClassName возвращает коллекцию элементов, но мне нужно чтобы все диви с классом page выполняли одну функцию
Ответить с цитированием
  #4 (permalink)  
Старый 14.12.2018, 23:01
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,791

Hovik, ну тогда у вас два варианта действий:
1. Делегировать обработчик события ближайшему общему для всех этих дивов родителю, тогда у вас одна функция будет обрабатывать нажатия на сразу все дивы, либо...;
2. Пробежаться в цикле по всем элементам коллекции и каждому элементу повешать свой обработчик события.

Вот пример кода первого варианта, предполагаю, что ближайший общий родитель - body:
document.body.addEventListener('click', function(e) {
    if (!e.target.classList.contains('page'))
        return;

    document.getElementById("action").classList.add("action-out");
});

addEventListener лучше, чем onclick=function(){}, потому что.
e.target - это.
С classList вы, видимо, знакомы.
Ответить с цитированием
  #5 (permalink)  
Старый 14.12.2018, 23:32
Кандидат Javascript-наук
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 116

Nexus,
Спасибо за помощь и за урок, когда-нибудь я тоже обязательно помогу новичкам

Последний раз редактировалось Hovik, 14.12.2018 в 23:38.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подскаите как менять класс у елемента в зависимость от класса другово елемента NirVanea Общие вопросы Javascript 4 10.09.2015 13:51
Добавление класса всем родительским элементам списка Torawhite Элементы интерфейса 0 01.05.2015 22:06
Добавление класса определенному элементу jQuery MasterDmx Events/DOM/Window 2 26.08.2014 14:26
Изменить класс родительского элемента STyLe Общие вопросы Javascript 1 29.05.2014 20:21
Передал аяксом класс в <div>, но как отловить событите клик на этот класс ? saturn Элементы интерфейса 11 31.05.2012 10:30