タブを動かすスクリプト

script.js

document.addEventListener('DOMContentLoaded', function(){
    // タブに対してクリックイベントを適用
    const tabs = document.getElementsByClassName('tab-item');
    for(let i = 0; i < tabs.length; i++) {
        tabs[i].addEventListener('click', tabSwitch, false);
    }

    // タブをクリックすると実行する関数
    function tabSwitch(){
        // タブのclassの値を変更
        document.getElementsByClassName('_active')[0].classList.remove('_active');
        this.classList.add('_active');
        // コンテンツのclassの値を変更
        document.getElementsByClassName('_show')[0].classList.remove('_show');
        const arrayTabs = Array.prototype.slice.call(tabs);
        const index = arrayTabs.indexOf(this);
        document.getElementsByClassName('content-item')[index].classList.add('_show');
    };
}, false);