● 마우스 이벤트
이번에는 마우스 이벤트를 살펴보겠습니다. 다음 이벤트 리스너를 window 객체에 추가합니다.
<script>
window.addEventListener('mousedown', (event) => {
console.log('mousedown', event);
});
window.addEventListener('mousemove', (event) => {
console.log('mousemove', event);
});
window.addEventListener('mouseup', (event) => {
console.log('mouseup', event);
});
</script>
마우스를 움직이면 mousemove 이벤트가 발생하고, 오른쪽이나 왼쪽 버튼을 클릭하면 mousedown, 클릭했다가 뗄 때는 mouseup 이벤트가 발생합니다. 이벤트 리스너의 매개변수인 event 안에는 화면 좌표 등의 정보가 담겨 있습니다.