MutationObserver로 DOM 변화 감지

MutationObserver 는 DOM의 변화를 감시합니다.
특정 Node를 target으로 정해 observe 함수를 실행하여 감시하다가 
해당 target에 변경이 일어나면 대상 node의 변화된 정보를 가져옵니다.

 

// 대상 node 선택
const target = document.getElementById('id');

// 감시자 인스턴스 만들기
const observer = new MutationObserver(mutations => {
  mutations.forEach(m => {
    console.log(m);
  });
});

// 감시자 설정
const config = { 
	attributes: true, 
	childList: true, 
	characterData: true 
}

// 감시 시작
observer.observe(target, config);

// 감시 종료
observer.disconnect();

 

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

MutationObserver - Web APIs | MDN