안녕하세요. 자바스크립트/자바쿼리 강의 중 tab기능 만들기를 듣는 중입니다. 에디터는 VSCODE를 사용중입니다.
자바스크립트 코드를 별도의 js파일로 만들어 html을 실행을 하면 어떤 오류메시지도 없이 작동을 안합니다.
js파일 불러오기가 안되서 그런가 하여 console.log로 출력을 확인해 보니 에러 없이 출력이 됩니다.
그래서 js파일에 작성한 코드를 html 스크립트 안쪽에 복붙을 해보니 잘 작동을 하네요. 뭐가 문제인지 모르겠습니다.
html 헤드태그 -> <script src="tab.js"></script> (html과 js파일이 같은 폴더에 있음)
tab.js ->
// 버튼 0을 누르면
// 모든 버튼 active 클래스 제거
// 모든 내용 show 클래스 제거
// 버튼 0 active 클래스 추가
// 내용 0 show 클래스 추가
$('.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');
});