[ Jquery ] 제이쿼리 addClass(), removeClass() 설명 및 예제(간단)
2020. 2. 4. 13:10
안녕하세요.
오늘은 제이쿼리 addClass()와 removeClass()에 대해서 알아 보겠습니다.
- addClass()의 경우 object에 class를 추가 하는 것입니다.
- removeClass()의 경우 object에 존재하는 class를 제거 하는 것입니다.
아래의 소스에 예제 및 설명을 적어놨습니다.
참고하시면 좋을거 같습니다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
<html>
<head>
<script>
$(document).ready(function(){
// 'divAdd'라는 id를 가진 object에 'addCl'이라는 class를 추가
$("#divAdd").click(function(){
$(this).addClass("addCl");
});
// 'divRe'라는 id를 가진 object에 'test'이라는 class를 제거
$("#divRe").click(function(){
$(this).removeClass("test");
});
});
</script>
</head>
<body>
<div id="divAdd">
클래스 추가 테스트입니다.
</div>
<div id="divRe" class="test">
클래스 삭제 테스트입니다.
</div>
</body>
</html>
|
이상입니다.
감사합니다.
'JavaScript' 카테고리의 다른 글
| [Javascript/Jquery] 자바스크립트 onclick 이벤트 리스너 설명 및 소스(초간단) (0) | 2020.02.13 |
|---|---|
| 자바스크립트(JavaScript)란 무엇이며 특징 및 장단점(기초) (0) | 2020.02.12 |
| [Jquery] 제이쿼리 오브젝트(object) 클래스 이름 가져오기, 클래스 데이터 추출 (0) | 2020.02.03 |
| [Jquery] 제이쿼리 체크박스 체크하기(간단) (0) | 2020.02.03 |
| [Jquery] 제이쿼리 null 체크 함수 예제(간단) (1) | 2020.02.03 |
이 글을 공유합시다
