코린이 개념잡기/JavaScript
이벤트와 클릭
폭주하는 세발자전거
2024. 12. 13. 11:50
이벤트 : 웹 페이지에서 발생하는 대부분의 일. 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>