2017-02-08 1 views
5

추가 클래스가 프로그래밍 방식으로 추가 된 div이 있습니다. 이 setInterval 구현을 사용하지 않고 클래스 이름 변경을 검색하려면 어떻게해야합니까?setInterval을 사용하지 않고 클래스 변경 감지

setInterval(function() { 
    var elem = document.getElementsByClassName('original')[0]; 
    if (elem.classList.contains("added")) { detected(); } 
}, 5500); 

MutationObserver?

+1

당신은 이벤트를 발생 수 있습니까? 또는 변경 작업을 수행하지 않는 클라이언트에서 클래스 변경을 감지하려고합니까? 즉. 문서가 변경 되었습니까? 푸시 업데이트로이를 수행 할 수 있습니다. –

+3

attributeFilter 옵션이있는 MutationObserver는 다음과 같은 용도로 사용됩니다 : [돌연변이 관찰자로 특정 스타일 속성 변경에 반응하는 방법] (// stackoverflow.com/a/39024295) -'style'을'class'로 대체하십시오. – wOxxOm

+0

변경하지 않습니다 ... 내 코드가 크롬 확장을 통해 주입되었습니다 – David

답변

6

mutation observer을 사용할 수 있습니다. 요즘 꽤 widely supported입니다. 당신이 클래스를 변경할 때

var e = document.getElementById('test') 
 
var observer = new MutationObserver(function (event) { 
 
    console.log(event) 
 
}) 
 

 
observer.observe(e, { 
 
    attributes: true, 
 
    attributeFilter: ['class'], 
 
    childList: false, 
 
    characterData: false 
 
}) 
 

 
setTimeout(function() { 
 
    e.className = 'hello' 
 
}, 1000)
<div id="test"> 
 
</div>

관련 문제