MediaWiki:Testnav.js

document.addEventListener('DOMContentLoaded', function() {  
    // 获取所有的.bwiki-tabs-a元素  
    const tabsContainers = document.querySelectorAll('.bwiki-tabs-a');  
  
    tabsContainers.forEach(container => {  
        // 获取当前容器内的所有.bwiki-tabs和.bwiki-tabs-container  
        const tabs = container.querySelectorAll('.bwiki-tabs');  
        const tabContents = container.querySelectorAll('.bwiki-tabs-container');  
  
        // 移除所有.bwiki-tabs的active类  
        tabs.forEach(tab => tab.classList.remove('active'));  
  
        // 移除所有.bwiki-tabs-container的active类，并隐藏所有内容  
        tabContents.forEach(tc => {  
            tc.classList.remove('active');  
            tc.style.display = 'none';  
        });  
  
        // 只为每个容器中的第一个.bwiki-tabs和.bwiki-tabs-container添加active类  
        if (tabs.length > 0) {  
            tabs[0].classList.add('active');  
            if (tabContents.length > 0) {  
                tabContents[0].classList.add('active');  
                tabContents[0].style.display = 'block';  
            }  
        }  
      
      
      
        // 为每个标签添加点击事件  
        tabs.forEach((tab, index) => {  
            tab.addEventListener('click', () => {  
                // 移除所有标签的active类  
                tabs.forEach(t => t.classList.remove('active'));  
  
                // 隐藏所有内容  
                tabContents.forEach(tc => {  
                    tc.style.display = 'none';  
                    tc.classList.remove('active');  
                });  
  
                // 为当前标签和内容添加active类  
                tab.classList.add('active');  
  
                // 显示对应的内容  
                const selectedTabContent = tabContents[index];  
                if (selectedTabContent) {  
                    selectedTabContent.style.display = 'block';  
                    selectedTabContent.classList.add('active');  
                }  
            });  
        });  
    });  
});