$('.tab-button').eq(0).click(function(){
$('.tab-button').removeClass('active');
$('.tab-content').removeClass('show');
$('.tab-button').eq(0).addClass('active');
$('.tab-content').eq(0).addClass('show');
});
이렇게하면 버튼 눌리는데
document.querySelector('.tab-button').addEventListener('click', function () {
document.querySelector('.tab-button').classList.add("active");
document.querySelector('.tab-content').classList.add('show');
});
이거도 되는데
document.querySelector('.tab-button').addEventListener('click', function () {
document.querySelectorAll('.tab-button').classList.remove("active");
document.querySelectorAll('.tab-content').classList.remove('show');
document.querySelector('.tab-button').classList.add("active");
document.querySelector('.tab-content').classList.add('show');
});
이거랑
document.querySelector('.tab-button').addEventListener('click', function () {
document.querySelector('.tab-button').classList.remove("active");
document.querySelector('.tab-content').classList.remove('show');
document.querySelector('.tab-button')[1].classList.remove("active");
document.querySelector('.tab-content')[1].classList.remove('show');
document.querySelector('.tab-button')[2].classList.remove("active");
document.querySelector('.tab-content')[2].classList.remove('show');
document.querySelector('.tab-button').classList.add("active");
document.querySelector('.tab-content').classList.add('show');
});
이거는 아예 아무것도 안눌리는데
이유가 무엇인가용? 검색해도 안나와서 그냥 궁금해서 물어봅니당
