addClass 메서드

addClass 메서드는 지정된 CSS 클래스를 요소에 추가합니다.

구문

CSS 클래스 하나:

javascript$(셀렉터).addClass(CSS 클래스 이름);

여러 CSS 클래스 (문자열로):

javascript$(셀렉터).addClass('클래스1 클래스2 클래스3 ...');

여러 CSS 클래스 (배열로):

javascript$(셀렉터).addClass(['클래스1', '클래스2', '클래스3', '...']);

집합 내 각 요소에 함수 적용:

javascript$(셀렉터).addClass(function(집합 내 번호, 요소의 현재 CSS 클래스들));

예제

우리 단락에는 클래스가 전혀 없습니다. 여기에 www 클래스를 추가해 봅시다:

html<p id="test">text</p>

javascript$('#test').addClass('www');

HTML 코드는 다음과 같이 될 것입니다:

html<p id="test" class="www">text</p>

예제

우리 단락에는 이미 클래스가 있습니다. 여기에 www 클래스를 추가로 추가해 봅시다:

html<p id="test" class="eee">text</p>

javascript$('#test').addClass('www');

HTML 코드는 다음과 같이 될 것입니다:

html<p id="test" class="eee www">text</p>

예제

우리 단락에는 이미 두 개의 클래스가 있습니다. 여기에 www 클래스를 추가로 추가해 봅시다:

html<p id="test" class="eee ggg">text</p>

javascript$('#test').addClass('www');

HTML 코드는 다음과 같이 될 것입니다:

html<p id="test" class="eee ggg www">text</p>

예제

우리 단락에는 이미 클래스가 있습니다. 여기에 www 클래스와 ggg 클래스, 이렇게 두 개의 클래스를 추가해 봅시다:

html<p id="test" class="eee">text</p>

javascript$('#test').addClass('www ggg');

HTML 코드는 다음과 같이 될 것입니다:

html<p id="test" class="eee www ggg">text</p>

함께 보기