탭 메뉴 콘텐츠- 스타일 02(실전 제작) with jQuery

Question

안녕하세요, 선생님. 항상 양질의 강의 감사드립니다. 이전 강의들을 따라하면서 제이쿼리 탭구조가 어느 정도 익숙해져서 이번 강의는 결과물만 보고 혼자서 미리 만들어보았는데요. 강의 22:05 부분을 보면 선생님은 var result = $ ( this ). attr ( 'data-alt' ) $ ( '.tabs div' ). removeClass ( 'active' ) $ ( '#' + result ). addClass ( 'active' ) 라고 코드를 작성하셨더라고요. var result = $ ( this ). attr ( 'data-alt' ) $ ( '#' + result ). addClass ( 'active' ) $ ( '#' + result ). siblings (). removeClass ( 'active' ); 이건 제가 짠 코드인데요. 선생님이 하신 것처럼 removeClass를 먼저 줘서 active를 삭제한 뒤 클릭한 하나에만 addClass로 active를 추가하는 것과 addClass를 먼저 준 후 형제 요소들은 removeClass로 active를 삭제하는 것에 차이가 있을까요? 문제없이 작동하긴 합니다만, 혹시 제가 모르는 차이가 있을지 궁금해서 질문 남깁니다!

코딩웍스(Coding Works) · Answer

네. 강의 영상에서는 체이닝(chainning)을 사용해서 하면 처음이신 분들이 익숙하지 않을까봐 한 줄 더 적었어요. 좀 더 바람직한 방식은 수강생분께서 위에 적으신 것 처럼 체이닝을 활용하는게 더 좋습니다.