[jQuery All in One] 클래스 선택자 다루기 (addClass, removeClass, hasClass, toggleClass)

jQuery version: 3.4.1

 

.addClass( className )

---

설명 : 지정된 클래스를 일치하는 요소 집합의 각 요소에 추가합니다.

 

.addClass( className )

className 
Type: String

.addClass( function )

function
Type: Function( Integer index, String currentClassName ) => String

사용예시

요소의 집합에서 선택된 요소의 클래스를 추가하는 예시입니다.

.removeClass( className )

---

설명 : 지정된 클래스를 일치하는 요소 집합의 각 요소에서 제거합니다.

 

.removeClass( className )

className 
Type: String

.removeClass( function )

function
Type: Function( Integer index, String currentClassName ) => String

사용예시

요소의 집합에서 선택된 요소의 클래스를 제거하는 예시입니다.

 

.hasClass( className )

---

설명 : 일치하는 요소 중 지정된 클래스가 지정되었는지 확인합니다.

 

.hasClass( className )

className 
Type: String

사용예시

요소의 집합에서 선택된 요소가 특정 클래스를 가지고 있는지 판별하는 예시입니다.

 

.toggleClass( className )

---

설명 : 클래스의 존재 여부 또는 상태 인수의 값에 따라 일치하는 요소 세트의 각 요소에서 하나 이상의 클래스를 추가하거나 제거하십시오.

 

.toggleClass( className )

className 
Type: String

.toggleClass( className, state )

className 
Type: String

state 
Type: Boolean

.toggleClass( function [, state ] )

function 
Type: Function( Integer index, String className, Boolean state ) => String

state 
Type: Boolean

사용예시

요소의 집합에서 선택된 요소의 클래스를 추가 및 제거하는 예시입니다.

 

 

실제 사용 예시

요소의 집합에서 단일 요소만 선택하고 제거하는 예시입니다.