IT 소스/jQuery

[jQuery] .addClass()

한량이야기 2023. 2. 16. 08:10
반응형

안녕하세요. 경제적, 시간적 자유를 꿈꾸는 한량입니다.

jQuery의 addClass() 메서드는 선택한 요소에 하나 이상의 CSS 클래스를 추가합니다. 

이 메서드는 선택한 요소에 새로운 CSS 클래스를 추가하여 

해당 요소의 스타일을 변경하거나 수정하는 데 사용됩니다.

 

addClass() 메서드를 사용하면 선택한 요소에 클래스를 추가할 수 있습니다. 

이 클래스는 다음과 같이 지정됩니다.

$("selector").addClass("classname");

여기서 'selector'는 요소를 선택하기 위한 CSS 선택자이며, 'classname'은 추가할 클래스의 이름입니다.

 

예를 들어, 다음과 같이 HTML 요소를 선택하고 클래스를 추가할 수 있습니다.

// javascript code
$("#myDiv").addClass("highlight");

// html code
<div id="myDiv">내용</div>

위 예제에서는 'myDiv'라는 'ID'를 가진 'div' 요소를 선택하고, 

'highlight'라는 클래스를 추가하였습니다. 

따라서, div 요소의 스타일을 'highlight' 클래스의 스타일로 변경할 수 있습니다.

 

addClass() 메서드를 사용하여 선택한 요소에 여러 개의 클래스를 추가할 수도 있습니다.

 이 경우, 클래스 이름은 공백으로 구분됩니다.

$("selector").addClass("classname1" "classname2" "classname3" ...);

위와 같이 공백으로 구분된 클래스 이름을 전달하면 선택한 요소에 여러 개의 클래스를 추가할 수 있습니다.

 

addClass() 메서드를 사용하여 선택한 요소에서 이미 존재하는 클래스를 추가하더라도, 

해당 클래스가 두 번 추가되지는 않습니다. 

즉, 선택한 요소에서 이미 클래스가 있는 경우에는 추가하지 않습니다.

 

반응형

'IT 소스 > jQuery' 카테고리의 다른 글

[jQuery] .css()  (0) 2023.02.16
[jQuery] .removeClass()  (0) 2023.02.16
[jQuery] .attr()  (0) 2023.02.16
[jQuery] .show()  (0) 2023.02.15
[jQuery] .hide()  (0) 2023.02.15