active시 선택됨 표시 만들기
본문
안녕하세요
// 1. 탭 버튼과 탭 내용 부분들을 querySelectorAll을 사용해 변수에 담는다.
const tabItem = document.querySelectorAll(".tab_menu");
const tabContent = document.querySelectorAll(".tab_content");
tabItem.forEach((item, index) => {
item.addEventListener("click", (e) => {
e.preventDefault(); // a
tabContent.forEach((content) => {
content.classList.remove("active");
});
tabItem.forEach((content) => {
content.classList.remove("active");
});
tabItem[index].classList.add("active");
tabContent[index].classList.add("active");
});
});
tab active를 이렇게 만들었는데
tab 이 active 됬을때
안에
<span class="visually-hidden">선택됨</span>
이런식으로 선택됨을 표시해주고 싶은데
javascript 요소 추가를 해보려고 해도 잘 안됩니다.
도움 부탁드립니다.
항상 모자라서 여쭤보게 되는데
답변 남겨주셔서 감사합니다
답변을 작성하시기 전에 로그인 해주세요.