.addEvnetListener()
대상에 이벤트 청취(Listen)를 등록합니다.
대상에 지정한 이벤트가 발생했을 때 지정한 함수(Handler)가 호출됩니다.
const parentEl = document.querySelector('.parent')
const childEl = document.querySelector('.child')
parentEl.addEventListener('click', () => {
console.log('Parent!')
}) // Parent!
childEl.addEventListener('click', () => {
console.log('Child!')
}) // Child! Parent!
.removeEvnetListener()
대상에 등록했던 이벤트 청취를 제거합니다.
메모리 관리를 위해 등록한 이벤트를 제거하는 과정이 필요할 수 있습니다.
const parentEl = document.querySelector('.parent')
const childEl = document.querySelector('.child')
const handler = () => {
console.log('Parent!') // Parent!
}
parentEl.addEventListener('click',handler)
childEl.addEventListener('click', () => {
parentEl.removeEventListener('click',handler)
}) // Child 영역을 클릭해도 Parent!가 안 나옴