250x250
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 자바알고리즘
- 스프링부트
- 알고리즘
- 혼공컴운
- 미라클모닝
- 자바개발자
- 개발자일기
- 백엔드개발자
- Codeup
- 소셜로그인구현
- 자바스크립트
- 자바
- 코드업
- Java
- 국비지원
- 데이터베이스
- 프로그래밍
- 백엔드
- 개발자
- 프로세스
- 코딩
- db
- React
- 운영체제
- 자바의정석
- 리액트
- 프로그래머스
- SpringBoot
- 국비지원코딩
- 프로그래머
Archives
- Today
- Total
초코딩(chocoding)
[코딩 애플] EventListener 본문
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 |