Участник:GIANT_2015:ru/common.js

Замечание. Возможно, после сохранения вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

• Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl-F5 или Ctrl-R (⌘-R на Mac)
• Google Chrome: Нажмите Ctrl-Shift-R (⌘-Shift-R на Mac)
• Internet Explorer: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl-F5
• Opera: Выберите очистку кэша в меню Инструменты → Настройки

//Получение всех блоков с табами
var tlbAll = document.querySelectorAll(".main-tlb");
//Выдаём каждому табу уникальный номер
for (mb_i = 0; mb_i < tlbAll.length; mb_i++) {
    tlbAll[mb_i].setAttribute("maintabs-num", mb_i);
    //Получаем табы и листы на первом уровне вложенности
    var tabAll = tlbAll[mb_i].querySelectorAll(
        '[maintabs-num="' + mb_i + '"] > * > .tab-item:nth-child(1n)'
    );
    var listAll = tlbAll[mb_i].querySelectorAll(
        '[maintabs-num="' + mb_i + '"] > .list-item: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);
        var item = tabAll[tb_i];
        item.addEventListener("click", function (event) {
            tabFun = document.querySelectorAll(".tab-item");
            listFun = document.querySelectorAll(".list-item");
            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("t-active");
                }
            }
            for (mb_j = 0; mb_j < listFun.length; mb_j++) {
                if (listFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) {
                    listFun[mb_j].classList.remove("l-active");
                }
            }
            listTarget = document.querySelector(
                '[maintabs-num="' +
                eventMainAtr +
                '"][listtabs-num="' +
                eventTabAtr +
                '"]'
            );
            event.target.classList.add("t-active");
            listTarget.classList.add("l-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);
    }
}
if (tlbAll.length > 0) {
    var tabZero = document.querySelectorAll('.tab-item[tabtabs-num="' + 0 + '"]');
    var listZero = document.querySelectorAll('.list-item[listtabs-num="' + 0 + '"]');
    for (tz_i = 0; tz_i < tabZero.length; tz_i++) {
        tabZero[tz_i].classList.add("t-active");
    }
    for (lz_i = 0; lz_i < listZero.length; lz_i++) {
        listZero[lz_i].classList.add("l-active");
    }
}