이벤트 : 웹 페이지에서 발생하는 대부분의 일. ex)마우스를 움직이는 일, 클릭, 스크롤, 키보드 입력 등
<body>
<div>
<button id="myBtn">Click!</button>
</div>
</body>
// 이벤트(Event)와 버튼 클릭
const btn = document.querySelector('#myBtn');
// 이벤트 핸들링(Event Handling)
btn.onclick = function() { // 이벤트 핸들러(Event Handler)
console.log('Hello Codeit!');
};
해당 태그를 변수로 담고, onclick이라는 프로퍼티에 함수를 할당해주면 버튼에 대한 클릭이벤트에 원하는 동작을 할 수 있다.
이벤트 핸들링 : 이벤트가 발생했을 때 어떤 특별한 동작을 하도록 이벤트를 다루는 것
이벤트 핸들러 : 구체적인 동작들을 코드로 표현한 함수 부분
그리고 잘 사용하진 않지만 HTML에서 바로 이벤트 핸들러를 등록 할 수도 있다.
<body>
<div>
<button id="myBtn" onclick="console.log('Hello Codeit!')">Click!</button>
</div>
</body>
'코린이 개념잡기 > JavaScript' 카테고리의 다른 글
console.log와 console.dir의 차이 (0) | 2024.12.13 |
---|---|
객체, 요소, 노드 (1) | 2024.12.13 |
태그 선택하기 (0) | 2024.12.12 |
조건문 (0) | 2024.01.20 |
함수 (0) | 2024.01.20 |