JS) Event

kangdari·2020년 3월 7일
0

Callback Func

setTimeout(func, time) : time이 지난 후 func 함수를 콜백하는 함수, ms 단위, timerId를 반환함.
clearTimeout(timerId): setTimeout 함수로 예약되어있던 func 호출을 취소.

setInterval(func, time): time 시간이 경과할 때마다 func 함수를 호출하는 콜백함수. intervalId 반환함.
clearInterval(intervalId): 주기적으로 호출되던 func 함수 호출을 취소

Event

form Event: HTML 문서의 form element에 변화가 생기거나 submit 버튼을 누를 경우 발생
window Event: 페이지가 모두 로드 되었을 때 onload event 발생
mouse Event: 사용자가 마우스를 조작했을 때 발생하는 이벤트
key Event: 사용자가 키보드를 조작했을 때 발생하는 이벤트
등등...

event handler 추가/삭제

tag 속성에 추가

	<h1 onclick="console.log('hi')">HTML Tag</h1>

**property에 직접 Handler 설정"

const form = document.getElementById('form');
form.onsubmit = () => { console.log(" from property ")}

addEventListner 메소드
element의 addEventListner(이벤트, 함수) 메소드를 호출해 이벤트 등록. 여러개의 이벤트 핸들러 등록 가능

const form = document.getElementById('form');
form.addEventListner('submit', ()=>{ console.log("from addEventListner") };

removeEventListner
element의 removeEventListner(이벤트, 함수) 메소드를 호출해 이벤트 삭제

form.removeEventListener("submit", ()=>{ console.log("from addEventListner") };      

0개의 댓글