Раскрытие (сворачивание) меню
Есть сайт с раскрывающимися подменю (боковая стрелка имеет направление вниз - класс
arrow_01_B(раскрытое подменю) или имеет направление вправо - arrow_01_R(свернутое подменю)) ![]() Привожу код для раскрытия/сворачивания меню let elemsoffilteropengroup = document.querySelectorAll('.FilterDropdown__filter-open-group'); for (let i=0; i<elemsoffilteropengroup.length; i++) { elemsoffilteropengroup[i].addEventListener('click', function(e) { if (e.target.childNodes[1].classList.contains('arrow_01_R')) { firstProperty = 'FilterDropdown__toggle-opened'; secondProperty = 'arrow_01_B'; lastProperty = 'IconFont_arrow_01_B'; e.target.childNodes[1].classList.item(0)=firstProperty; e.target.childNodes[1].classList.item(1)=secondProperty; e.target.childNodes[1].classList.item(e.target.childNodes[1].classList.length-1)=lastProperty; } else { firstProperty = 'FilterDropdown__toggle-closed'; secondProperty = 'arrow_01_R'; lastProperty = 'IconFont_arrow_01_R'; e.target.childNodes[1].classList.item(0)=firstProperty; e.target.childNodes[1].classList.item(1)=secondProperty; e.target.childNodes[1].classList.item(e.target.childNodes[1].classList.length-1)=lastProperty; } }, true); } Несмотря на наличие этого кода меню не разворачивается (не сворачивается). Подскажите как добиться разворачивания\сворачиван я меню. |
Очень много странностей в коде у вас
elemsoffilteropengroup[i].addEventListener('click', function(e) ... Обработчик вешается на какой то div.FilterDropdown__filter-open-group Далее идет if (e.target. ... А target будет какой-нибудь <span> или <i> в этом блоке. Это именно то, что вы хотели? .childNodes[1] childNodes - это все дочернии узлы внутри узла. Вы поставили пробел между элементами <span> <span> и этот пробел станет текстовым узлом. Перевод строки и табуляции для выравнивания кода тоже становятся узлами. Так, что поосторожнее с childNodes. Если нужны именно элементы, то используйте .children Так, что кому вы потом очень странным образом назначаете и меняет классы, остается загадкой. И если вы используете средства разработчика браузера, то что стоит пройти в отладчике этот код и посмотреть что чему вы назначаете, и заглянуть в консоль по поводу красного кружка с восклицательным знаком и цифрой 9 в правом верхнем углу |
1. А div.FilterDropdown__filter-open-group включает в себя заголовок (как на рисунке Основной цвет корпуса) и стрелку для раскрытия\сворачивания меню.
2. target-ом должен быть элемент <i> - стрелка раскрытия\сворачивания меню и обращение к нему должно происходить через childNodes[1]. 3. Классы меняются для смены вида стрелок. |
Цитата:
Если <i> это e.target, то что e.target.childNodes[1]? |
Часовой пояс GMT +3, время: 04:34. |