私のサイトではないイベントリスナーを追加できますか？

Question

DOM要素の変更に関するブラウザ通知を受け取ることができるように、あるサイトの一部のDOM要素のすべての変更について知りたいと思います。 サイトにコードを書き込めない場合、どうすればいいですか？ 私は、このアプローチを使用したい：

// select the target node 
 
var target = document.getElementById('some-id'); 
 
    
 
// create an observer instance 
 
var observer = new MutationObserver(function(mutations) { 
 
    mutations.forEach(function(mutation) { 
 
    console.log(mutation.type); 
 
    });  
 
}); 
 
    
 
// configuration of the observer: 
 
var config = { attributes: true, childList: true, characterData: true }; 
 
    
 
// pass in the target node, as well as the observer options 
 
observer.observe(target, config); 
 
    
 
// later, you can stop observing 
 
observer.disconnect();

<div id="some-id"></div>

ありがとうございました！

Answer 1

で、より高度なことを行うことができます。これは、たとえばブラウザ拡張の主な動作です。

しかし、あなたはまた、単にあなたのコードを取ると、お使いのブラウザのコンソールに貼り付けることができます（クローム：Ctrlキー + Shiftキー + JまたはF12）

この例では、我々は<div id="question-header">をobeserveますこのSOページの

var node = document.createElement("b");     
var textnode = document.createTextNode("Hello new item"); 
node.appendChild(textnode); 
document.getElementById("question-header").appendChild(node); 

Answer 2

あなたはこのようなものであることを達成することができます

$(function(){ 
    var keep = ''; 
    var ajaxurl = "http://foo.bar"; 

    setInterval(function(){ 
     $.get(ajaxurl, { sample_data : 'test' }, function(response){ 

      var log = "<p>Checked</p>"; 

      if(keep != '' && keep !== response) 
       log = "<p>Something has changed</p>"; 

       $('.log-container').append(log); 

     }); 

    }, 2000); 
}); 

ができますが、あなたは常に任意のウェブサイトへのクライアント側のコードを追加することができますpusherJS https://github.com/pusher/pusher-js