반응형
이번 강의 실습에서 헤멘 이유
: 함수명 오타로 인해 error 발생, 불러올 element 주소를 잘못지정한 경우.
유저의 행동을 listen 하는 이벤트
요소의 스타일 컬러를 바꾸는 이벤트 만들기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Moment</title>
<link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="hello">
<h1>Click me!</h1>
</div>
<script src="app.js"></script> <!--body 사이에 있고, 반드시, 경로, 이름 확인-->
</body>
</html>
const title = document.querySelector("div.hello");
function handleTitleClick() {
//console.log("title was clickedl!");
title.style.color="blue";
}
function handleMouseenter() {
title.innerText = "Mouse is here";
}
function handleMouseleave() {
title.innerText = "Mouse is gone!";
}
title.addEventListener("click", handleTitleClick);
title.addEventListener("mouseenter", handleMouseenter);
title.addEventListener("mouseleave", handleMouseleave);addEventListener -> user의 행동을 tracking&count해서 콘솔에 호출
mouseenter, mouseleave -> document () 로 콘솔에 다 불러온다음, ctrl+F로 찾고자 하는 기능을 드래그한다음에,
코딩할 때 타자로 치지 말고, 주의깊게 본 다음에 붙여넣기 해야, 오류가 생기지 않는다. ㅠㅜ
'Developer' 카테고리의 다른 글
| CSS in JavaScript (0) | 2021.12.28 |
|---|---|
| More Events (0) | 2021.12.28 |
| serching for element 2 (0) | 2021.12.28 |
| Searching For Elements (0) | 2021.12.28 |
| HTML in JavaScript (정말*100중요) (0) | 2021.12.28 |