Версия 15:17, 28 сентября 2023 | | Версия 15:20, 28 сентября 2023 |
Строка 1: | | Строка 1: |
? | //Получение всех блоков с табами | | |
| var mbAll = document.querySelectorAll(".main-block") | | | var mbAll = document.querySelectorAll(".main-block") |
| //Выдаём каждому табу уникальный номер | | | //Выдаём каждому табу уникальный номер |
Версия 15:20, 28 сентября 2023
var mbAll = document.querySelectorAll(".main-block")
//Выдаём каждому табу уникальный номер
for (mb_i = 0; mb_i < mbAll.length; mb_i++) {
mbAll[mb_i].setAttribute("maintabs-num", mb_i);
//Получаем табы и листы на первом уровне вложенности
var tabAll = mbAll[mb_i].querySelectorAll(`[maintabs-num="${mb_i}"] > .tab-block:nth-child(1n)`);
var listAll = mbAll[mb_i].querySelectorAll(`[maintabs-num="${mb_i}"] > .list-block:nth-child(1n)`);
//Даём каждому табу номер блока и номер таба
for (tb_i = 0; tb_i < tabAll.length; tb_i++) {
tabAll[tb_i].setAttribute("maintabs-num", mb_i);
tabAll[tb_i].setAttribute("tabtabs-num", tb_i);
item = tabAll[tb_i];
item.addEventListener('click',
function (event) {
tabFun = document.querySelectorAll(".tab-block");
listFun = document.querySelectorAll(".list-block");
eventMainAtr = event.target.getAttribute("maintabs-num");
eventTabAtr = event.target.getAttribute("tabtabs-num");
for (mb_j = 0; mb_j < tabFun.length; mb_j++) {
if (tabFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) {
tabFun[mb_j].classList.remove('active');
}
}
for (mb_j = 0; mb_j < listFun.length; mb_j++) {
if (listFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) {
listFun[mb_j].classList.remove('active');
}
}
listTarget = document.querySelector(`[maintabs-num="${eventMainAtr}"][listtabs-num="${eventTabAtr}"]`);
console.log(listTarget);
listTarget.classList.add('active');
event.target.classList.add('active');
})
}
//Даём каждому листу номер блока и номер листа
for (lb_i = 0; lb_i < listAll.length; lb_i++) {
listAll[lb_i].setAttribute("maintabs-num", mb_i);
listAll[lb_i].setAttribute("listtabs-num", lb_i);
}
}