169 похожих чатов

Приветствую. Помогите разобраться вот в какой вещи. В голове не

укладывается. Есть код:
var acc = document.getElementsByClassName("accordion");

for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
/* Toggle between adding and removing the "active" class,
to highlight the button that controls the panel */
this.classList.toggle("active");

Получается, html дерево, это объект (или массив), элементы которого мы можем итерировать?

Вот пример того, как сделал я:

const accordion = document.querySelector('.accordion');
const title = document.querySelector('h1');

title.addEventListener('click', function () {
accordion.classList.toggle('show');
})

title.addEventListener('keydown', function (event) {
event.preventDefault();

if(event.code == 'Tab') {
accordion.classList.toggle('show')
}
})

Объясните, зачем в примере реализуют аккордеон через цикл for?

upd: Правильная ли у меня реализация?

6 ответов

11 просмотров

> это объект (или массив) Массивоподобный объект, по которому можно итерироваться. Можно вешать листенеры на каждый элемент, тогда нужно использовать цикл. Можно повесить один листенер на родителя и внутри колбэка определять на кого кликнули.

Фёдор- Автор вопроса
Alhimik [frozen]
> это объект (или массив) Массивоподобный объект, ...

Получается, если брать вот этот вариант: -> "Можно повесить один листенер на родителя и внутри колбэка определять на кого кликнули." То это надо отлавливать событие через event.target?

Фёдор- Автор вопроса
Alhimik [frozen]
+

Какой вариант наиболее предпочтительный через event.target или же через for?

Фёдор
Какой вариант наиболее предпочтительный через even...

Кто как делает. Я использую вариант где один слушатель.

Похожие вопросы

Обсуждают сегодня

комрады, че-та лыжы не едут var tmpFont: TFont; begin tmpFont:= TFont.Create; try case rgFontColor.ItemIndex of 0: tmpFont.Color:= clWindowText; 1: tmpFo...
Ed Doc
34
Интересно, нет ли какого-то способа получить из dll не адрес самой метки, а адрес со смещением?
The Bird of Hermes
54
Можно вообще написать: Person fName' lName' age'. Тогда действительно имена полей потребуются лишь в строковом виде, чтобы эти fName' и т.д. достать :-) Но разве для этого нуж...
Михаил
8
generic procedure function test<T>(param: T); type case T of longint: NewT = word; longword: NewT = byte; end; var v1: NewT; Как это можно сделать? Чтобы у меня...
notme
21
Делал задачу вот такую https://stepik.org/lesson/4985/step/9?unit=1083 получилось такое https://play.haskell.org/saved/ipKrepqe оно работает, тестов много не писал, но работае...
Fedor
22
Скажите, можно ли как-то "переместить" динамический массив из одной переменной в другую? Скажем, переместить из TList<> в TArray<>. Именно переместить, а не скопировать. Если ...
Eugene Krasnikov (ᴊɪɴ x)
35
преобразовать в число или в один тип?
Alexey Kulakov
11
Hello everyone I am trying to run 4 year old project and I am having this issue anyone can help?
Nitish Garg
11
Всем привет, прошу совета по сложившейся ситуации: Windows приложение подключается к БД MySQL используя Firedac. При работе с версией MySQL 5.7 все отлично, но когда подключаю...
Constantine
6
Всем добрый вечер. Нужна помощь с прикруткой telegram-vapor-bot к проекту Vapor. Удалось после старта приложения отправить тестовое сообщение в бот, вот только сразу после это...
advanc3d
3
Карта сайта