chrome ext: limit DOMNodeInserted

Question

Я разрабатываю хром-плагин, который вводит класс каждому элементу страницы. Но в страницах, таких как Facebook или щебет есть содержание загружается динамически, поэтому я использую этот код, чтобы проверить, когда этот conent загружен:

document.addEventListener('DOMNodeInserted', function() { 
    console.log('fatto'); 
}, true); 

проблема в том, что таким образом, скрипт срабатывает каждый раз, когда узел вставляется. Поэтому я хотел бы добавить какое-то ограничение. что-то вроде: Когда узел вставлен, запустите сценарий, а затем подождите 2 секунды.

Я пытаюсь что-то подобное, но не успех:

var check = 1; 

document.addEventListener('DOMNodeInserted', function() { 
    if(check == 1) { 
     check = 0; 
     setInterval(function() { 

      //do stuff 

      check = 1; 

     }, 1000); 

     console.log('fatto'); 
    } 
}, true); 

благодаря

Answer 1

Я видел эту технику называют дребезга. Вот пример:

(function() { 
    var timer; 

    var doStuff = function() { 
     timer = null; 
     alert("Doing stuff"); 
    }; 

    document.addEventListener('DOMNodeInserted', function() { 
     if (timer) { 
      window.clearTimeout(timer); 
     } 
     timer = window.setTimeout(doStuff, 2000); 
    }, false); 
})(); 

Вы можете обобщить это:

function addDebouncedEventListener(obj, eventType, listener, delay) { 
    var timer; 

    obj.addEventListener(eventType, function(evt) { 
     if (timer) { 
      window.clearTimeout(timer); 
     } 
     timer = window.setTimeout(function() { 
      timer = null; 
      listener.call(obj, evt); 
     }, delay); 
    }, false); 
} 

addDebouncedEventListener(document, 'DOMNodeInserted', function(evt) { 
    alert(evt.target.nodeName + " inserted"); 
}, 2000); 

Answer 2

Я бы сказал:

var timeout; 

document.addEventListener('DOMNodeInserted', function() { 
    startNewTimeout(); 
}, true); 

function startNewTimeout() { 
    //only if there is no active timeout already 
    if(timeout === undefined) { 
     timeout = setTimeout(function() { 

      timeout = undefined; 
      //do stuff 

     }, 1000); 
    } 
} 

Этот сценарий не будет задерживать выполнение //do stuff на неопределенный срок. Он будет следить за тем, чтобы выполнялся //do stuff макс. 1сек после первого события DOMNodeInserted.