본문 바로가기
반응형

JavaScript 이벤트3

Javascript 이벤트 위임 패턴, 이벤트 전파 중단 오늘은 Javascript 이벤트 위임이란 무엇인지, 이벤트의 전파를 중단하는 방법은 어떤 것이 있는지 알아보려고 합니다. 아주 간단한 상황에서는 앞선 글에서 소개한 이벤트 제어 방법으로도 충분하지만 조금 더 효율적, 효과적으로 이벤트를 다루기 위해선 반드시 이벤트 위임(Event Delegation) 패턴을 알아두어야 합니다. 1. 이벤트 위임이 필요한 이유 이벤트 위임이 무엇인지 알아보기 전, 이벤트 위임이란 것이 왜 필요한지 먼저 예제를 통해 알아보겠습니다. Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 let list = document.querySelectorAll("li"); list.forEach(function(li) { li.addEventListener("c.. 2023. 1. 19.
[Javascript] Javascript event, 이벤트 전파란? 지난 글에 이어 Javascript Event, 그중에서도 이벤트의 전파에 대해 알아보겠습니다. 2023.01.02 - [Javascript] - [Javascript] Javascript event, Event Handler란 무엇인가 [Javascript] Javascript event, Event Handler란 무엇인가 Javascript를 사용하는 브라우저 환경에서 이벤트란 무엇인지, 이벤트 핸들러와 핸들러를 등록하는 방식에는 어떤 것이 있는지 알아보도록 하겠습니다. (feat. addEventListener) 이벤트란? 브라우저 환 do-it-bobby.tistory.com 이벤트의 흐름 브라우저에서 특정 이벤트가 발생했을 때, 내부적으로 어떤 일이 일어날까요? addEventListener의.. 2023. 1. 3.
[Javascript] Javascript event, Event Handler란 무엇인가 Javascript를 사용하는 브라우저 환경에서 이벤트란 무엇인지, 이벤트 핸들러와 핸들러를 등록하는 방식에는 어떤 것이 있는지 알아보도록 하겠습니다. (feat. addEventListener) 이벤트란? 브라우저 환경에서 이벤트란 DOM 요소와 관련되어 발생하는 어떠한 사건들을 의미합니다. 예를 들어 다음과 같은 상황들이 있을 수 있습니다. 버튼을 클릭했을 때 브라우저 창의 크기를 조절했을 때 웹페이지가 로드 됐을 때 브라우저는 이 외에도 다양한 이벤트를 감지 할 수 있습니다. Event reference | MDN Events are fired to notify code of "interesting changes" that may affect code execution. These can arise.. 2023. 1. 2.
반응형