백엔드/JavaScript

[Momentum] Clone Coding - 08

silvering0 2021. 8. 25. 14:53

Event

 : 클릭, 마우스가 올라가는 것, 엔터 누르기 등등이 event 라고 할 수 있다.

 

javascript 는 event 를 listen 가능.

 = eventlistener

 

function gandleTitleClick(){

 console.log("title was clicked!");

}



title.addeventlistener("click", handleTitleClick);

이렇게 쓰면, 클릭 발생 시 이벤트가 실행된다.

 

근데,

handleTitleClick()

이렇게 추가를 해주면,

() 가 있기 때문에, 자동으로 클릭이 된다.

클릭을 수동으로 하고 싶다면 () 를 넣어주지 않아야 한다.

 

이 클릭은 어디를 선택하던지 가능! button 이 아니라 그냥 h1 태그와 같은 것들도 클릭 가능 하다.

 

여기서 hadleTitleClick() 함수 안에

title.style.color = "red";

이런 식으로 style 을 추가해 주면, 바뀐다!

 

console 에서 보면,

onanimationiteration

onabort 

onclick

onchange.......

등 on 이 붙은 것들이 있는데, 이건 eventlistener에 속한다.

따라서 이벤트를 사용하고 싶을 때는 on 이 붙지 않은 것을 써야 함.