728x90
반응형
[JavaScript & jQuery] class(클래스) 넣었다 뺐다 하는 방법 !! .toggleClass() 사용법
예제 코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.orange {
background-color: orange;
}
.test {
width: 100px;
height: 100px;
border: 1px solid;
}
</style>
</head>
<body>
<div class="test">
<h1>test</h1>
</div>
<button id="orange">오렌지</button>
</body>
</html>
<script src="https://releases.jquery.com/git/jquery-3.x-git.js"></script>
<script>
$(document).ready(function() {
$('#orange').click(function() {
$('.test').toggleClass('orange');
});
});
</script>결과값
test
728x90
반응형
'Coding > JavaScript' 카테고리의 다른 글
| [JavaScript] html에 숫자 콤마(,) 표시하는 정규식 사용 방법 !! (0) | 2023.02.12 |
|---|---|
| [JavaScript] 자바스크립트 <div>, <span> 태그에 text 넣는 방법 !! (0) | 2023.02.09 |
| [JavaScript] 자바스크립트 배열(array) forEach문 쓰는 방법 !! (0) | 2023.02.01 |
| [JavaScript] Handlebars.js 에서 each문 쓰는 방법 !! (0) | 2023.01.31 |
| [JavaScript] location.reload() 새로고침시 딜레이 및 시간 주는 방법 !! (0) | 2023.01.26 |
댓글