초코딩(chocoding)

[코딩 애플] EventListener 본문

[JS] 자바스크립트

[코딩 애플] EventListener

sweetychocoding 2023. 8. 3. 09:34
728x90

이벤트리스너란?

이벤트 리스너는 DOM 객체에서 이벤트가 발생할 경우 해당 이벤트 처리 핸들러를 추가할 수 있는 오브젝트이다.

이벤트 리스너를 이용하면 특정 DOM에 위에 말한 Javascript 이벤트가 발생할 때 특정 함수를 호출한다.

 

이벤트 리스너 등록하기

=> DOM객체.addEventListener(이벤트명, 실행할 함수명)

 

 

<간단한 예시>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        function showDiv(change) {
            document.getElementById("div").innerHTML = change;
        }
    </script>
</head>

<body>
    <button id="btn" onclick="showDiv('바보')">버튼을 누르거라</button>
    <div id="div"></div>
</body>

</html>
728x90

'[JS] 자바스크립트' 카테고리의 다른 글

[별코딩] useRef()  (0) 2023.08.08
[별코딩] useEffect()  (0) 2023.08.07
[코딩 애플] function, Parameter  (0) 2023.08.02
[코딩 애플] component  (0) 2023.08.02
[코딩 애플] Ref.1  (0) 2023.08.01