Front-end/JavaScript
[JavaScript] jQuery 선택자 - 상위 태그 선택
parent() : 셀렉터의 바로 위 상위요소인 하나의 부모 선택 parents() : 셀렉터의 모든 상위 요소들을 선택 (html, body 태그 포함)
Front-end/JavaScript
Front-end/JavaScript
[JavaScript] jQuery 선택자 - 형제 관계 태그 선택
siblings() $('셀렉터').siblings('대상') : 셀렉터의 형제 요소 중 특정 대상을 선택 b12클래스의 형제인 b11클래스에 css를 설정 next() $('셀렉터').next() : 셀렉터 바로 뒤에 있는 요소 선택 b11클래스 바로 뒤에 있는 b12클래스에 css 적용 nextAll() $('셀렉터').nextAll() : 셀렉터 뒤에 있는 모든 요소 선택 b21클래스 뒤에오는 모든 형제 요소 b22, b23 클래스에 css 적용 nextUntil() $('셀렉터1').nextUntil('셀렉터2') : 셀렉터1과 셀렉터2 사이의 요소 모두를 선택 prev() $('셀렉터').prev() : 셀렉터 바로 전에 있는 요소 선택
Front-end/JavaScript
[JavaScript] jQuery 클래스 추가, 삭제, 반전 명령
addClass() $('셀렉터').addClass('클래스명') : 특정 클래스 추가하기 ex) 기존에 on 클래스를 가진 b11과 addClass로 on 클래스를 추가한 b13의 배경색이 생깁니다. removeClass() $('셀렉터').removeClass('클래스명') : 특정 클래스 삭제하기 toggleClass() $('셀렉터').toggleClass('클래스명') : 특정 클래스가 있으면 삭제 없으면 추가
Front-end/JavaScript
[JavaScript] jQuery 요소 복사, 대체, 삭제하기
복사하기 clone $('셀렉터').clone() ex) 대체하기 replaceAll, replaceWith $('셀렉터1').replaceAll('셀렉터2') : 셀렉터2 구조가 셀렉터1로 대체 (셀렉터1 사라짐) $('셀렉터1').replaceWith('내용') : 셀렉터 안의 모든 구조가 내용으로 대체 삭제하기 remove, empty $('셀렉터').remove() : 셀렉터 삭제 $('셀렉터').empty() : 셀렉터 안의 내용 삭제
