Private code

タグに連動した投稿の表示切替

ページ遷移なしに投稿を表示切替 タグをクリックするたびに切り替わる
const $tab = document.querySelectorAll('[data-tab]'); const $link = document.querySelectorAll('[data-content]'); const classClick = 'clicked'; let index = 0; let tabLength = $tab.length; const init = $link[0].style.display ='block'; const clickHandler = (e) =>{ e.preventDefault(); let tabValue = e.target.dataset.tab; let index = 0; let tabLength = $tab.length; while(index < tabLength){ $tab[index].classList.remove(classClick); $link[index].style.display = 'none'; index++; } e.target.classList.add(classClick); $link[tabValue].style.display = 'block'; } while(index < tabLength){ $tab[index].addEventListener('click' , (e) =>{ clickHandler(e); }) index++; }
Back to Home