분류 javascript

이벤트 핸들러 첨부 또는 분리 (3/86)

컨텐츠 정보

  • 조회 439 (작성일 )

본문

on 속성 사용 (권장하지 않음) 


on {eventName} 속성을 통해 이벤트 핸들러를 설정할 수 있습니다. 여기서 eventName은 이벤트 이름을 나타냅니다. 예를 들면 다음과 같습니다.


https://htmldom.dev/attach-or-detach-an-event-handler 


ele.onclick = function() {
    ...
};

// Remove the event handler
delete ele.onclick;

각 이벤트에 대해 하나의 핸들러만 연결할 수 있으므로 이 방법은 권장되지 않습니다. 예를 들어 onclick 속성을 설정하면 click 이벤트의 기존 핸들러가 재정의 됩니다.


addEventListener 메소드를 사용하십시오. 


const handler = function() {
    ...
};

// Atatch handler to the `click` event
ele.addEventListener('click', handler);

// Detach the handler from the `click` event
ele.removeEventListener('click', handler);

이벤트 이름은 addEventListener 및 removeEventListener 메소드 모두에서 첫 번째 매개 변수로 전달됩니다. 이벤트 이름 앞에 on을 붙여야 하는 첫 번째 방법과 다릅니다.



dom