onload

• 객체가 로드되었을 때 발생
• 웹페이지의 모든 컨텐츠가 완전히 로드된 후 수행
• 가장 자주 사용되는 이벤트

onclick

• 마우스로 요소를 클릭했을 때

ondblclick

• 마우스로 요소를 연속 클릭했을 때

onmouseover

• 마우스를 요소 위에 올렸을 때

onmouseout

• 마우스가 요소 위에서 벗어났을 때

onmousemove

• 마우스를 요소 위에서 움직일 때

onkeydown

• 키보드의 키를 눌렀을 때
• 누르고 있을 때 한번만 실행

onkeypress

• 키보드의 키를 눌렀을 때
• 누르고 있는 동안 계속 실행

onkeyup

• 키보드의 키를 눌렀다가 뗐을 때
• keydown - keypress - keyup 순으로 이벤트 발생함

onfocus

• 요소에 입력 커서가 왔을 때
• 포커스를 받았을 때

onblur

• 입력 커서가 요소에서 나갔을 때
• 포커스를 잃었을 때

onchange

• 요소의 값이 변경되었을 때

이벤트 할당하기

HTML 태그에서 할당

<button onclick="proc()">클릭</button>

스크립트에서 할당

<script>
document.getElementById("myBtn").onclick = proc; // 수행될 함수명 
</script>

이벤트리스너

• 스크립트에서 요소에 이벤트 리스너를 추가해서 이벤트 할당
• addEventListener
• removeEventListener 메서드 사용해서 이벤트 제거

<script>
document.getElementById("myBtn").addEventListener("click",proc);
</script>