ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • JavaScript 이벤트 객체
    프로그래밍/JavaScript 2022. 10. 13. 07:13
    728x90

     

     

    이벤트 객체는 특정 타입의 이벤트와 관련이 있는객체로 해당 타입의 이벤트에 대한 상세 정보는 저장한다. 모든 이벤트 객체는 이벤트의 타입을 나타내는 type 프로퍼티와 , 이벤트 대상을 나타내는 Target 프로퍼티를 가진다. 이벤트 객체는 이벤트 리스너가 호출 될 때 인수로 전달된다.

     

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>이벤트 객체</title>
    </head>
    <body>
        <input type="button" id="btn" value="확인">
        <script>
            'use strict';
            function clickBtn(e){
                console.log(e.target);     // <input type="button" id="btn" value="확인">
                console.log(e.target.id);  // btn
                console.log(e.target.value); // 확인
                console.log(e.type); // click
            }
            const btn = document.getElementById('btn');
            btn.addEventListener('click', clickBtn);
        </script>
    </body>
    </html>

     

     

     

     

     

    728x90

    '프로그래밍 > JavaScript' 카테고리의 다른 글

    JavaScript { ... } 문법  (0) 2022.12.03
    JavaScript 이벤트 전파(Event Propagation)  (0) 2022.10.14
    JavaScript 이벤트  (0) 2022.10.12
    JavaScript 폼객체  (0) 2022.10.11
    JavaScript 노드 복제  (0) 2022.10.10

    댓글

Designed by Tistory.