title.addEventListener("click", handleTitleClick);
//.removeEventListener 이런게 가능해서 addEventListener 선호
//title.onclick = handleTitleClick;
function handleTitleClick() {
const clickedClass = "clicked sexy-font";
if (h1.classList.contains(clickedClass)) {
h1.className = "";
} else {
h1.className = clickedClass;
}
}
h1.addEventListener("click", handleTitleClick);
<!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">
<link rel="stylesheet" href="style.css">
<title>Momentum</title>
</head>
<body>
<div class="hello">
<h1 class="sexy-font">Click me!</h1>
</div>
<script src="app.js"></script>
</body>
</html>
classList ==>>
Allows for manipulation of element's class content attribute as a set of whitespace-separated tokens through a DOMTokenList object.
add, remove 가능!!!!!
'프론트 > javascript' 카테고리의 다른 글
| ES6 자바스크립트 최신 문법 (0) | 2022.08.05 |
|---|---|
| Todo App 만들기 (0) | 2022.08.03 |
| 숫자 예상 게임과, GitHub와 Netlify를 이용한 쉽고 빠른 HTTPS 무료 호스팅 (0) | 2022.08.03 |
| var, let, const (0) | 2022.07.13 |
| 호이스팅(hoisting) (0) | 2022.06.09 |