크롬 개발자 도구 기능 사용하기 #2 : 이벤트 관련 기능

1. 엘리먼트에 걸려있는 이벤트 목록 보기

네이버 페지를 예로 들면 검색어 입력창은 query 라는 id를 가지고 있다.

검색어 입력창에 어떤 이벤트들이 걸려 있는지 알아볼려면

var txt = document.querySelector('#query')
getEventListeners(txt)

요렇게 해서 보면 검색어 입력창에는 blur, click, focus, keydown, keyup 이벤트가 걸려 있는것을 알 수 있다.

2. 엘리먼트에서 발생하는 이벤트 모니터링

네이버 검색어 입력창에서 발생하는 이벤트를 모니터링 하기 위해서는 요렇게 하면 된다.

click, keyup 이벤트를 모니터링 하려면

monitorEvents(txt, ['click', 'keyup'])

발생하는 모든 이벤트를 모니터링 하려면 요렇게

monitorEvents(txt)

3. 이벤트 모니터링 끄기

모니터링 하던것을 끄려면 요렇게~

unmonitorEvents(txt)