event

<script>
        window.onload = function() {
            let btn = document.getElementById("mybtn");
            btn.onclick = function(event) {
                // onclick 이벤트가 발생하면 event객체 자동 생성 > e라는 변수가 그 객체의 주소
                // 객체에는 이벤트와 관련도니  다양한 정보
                console.log(event.type); // event.type
                console.log(event.target);
                console.log(event.currentTarget);
                console.log(event.x);
                console.log(event.y);
            }
            let btn2 = document.getElementById("mybtn2");
            let handler = function(event) {
                    // handler가 함수의 주소를 가지고 있다.
                    switch (event.type) {
                        case "click":
                            alert("클릭");
                            break;
                        case "mouseover":
                            event.target.style.background = "red";
                            break;
                        case "mouseout":
                            event.target.style.background = "";
                            break;
                    }
                }
                // 각각의 event에 대한 함수가 없다 > 하나의 함수로 이벤트 처리
            btn2.onclick = handler;
            btn2.onmouseover = handler;
            btn2.onmouseout = handler;
        }
    </script>