Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/415.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 突变观察者不开火_Javascript_Jquery_Html_Facebook_Google Chrome Extension - Fatal编程技术网

Javascript 突变观察者不开火

Javascript 突变观察者不开火,javascript,jquery,html,facebook,google-chrome-extension,Javascript,Jquery,Html,Facebook,Google Chrome Extension,嗨,我正在构建一个chrome扩展。我有一个javascript文件,我想在其中检测facebook.com上div的变化,所以我将其附加到一个变异观察者。现在的问题是,如果我在Facebook上导航到另一个页面,比如单击主页按钮,突变观察者将停止工作,即使这个新页面中存在具有相同id的div。它只在我刷新页面后才开始工作。有没有办法解决这个问题 此外,我所有的代码都封装在document.ready jquery函数中,因此我假设当我通过单击home按钮导航到新的facebook页面时,该函数

嗨,我正在构建一个chrome扩展。我有一个javascript文件,我想在其中检测facebook.com上div的变化,所以我将其附加到一个变异观察者。现在的问题是,如果我在Facebook上导航到另一个页面,比如单击主页按钮,突变观察者将停止工作,即使这个新页面中存在具有相同id的div。它只在我刷新页面后才开始工作。有没有办法解决这个问题

此外,我所有的代码都封装在document.ready jquery函数中,因此我假设当我通过单击home按钮导航到新的facebook页面时,该函数会自动触发,但这不会发生。它仅在我显式键入url或在导航后刷新页面时激发

代码如下所示:

    $ (document).ready( function() {

  var observeDOM = (function(){
      var MutationObserver = window.MutationObserver || window.WebKitMutationObserver,
          eventListenerSupported = window.addEventListener;

      return function(obj, callback){
          if( MutationObserver ){
              // define a new observer
              var obs = new MutationObserver(function(mutations, observer){
                  if( mutations[0].addedNodes.length || mutations[0].removedNodes.length )
                      callback();
              });
              // have the observer observe foo for changes in children
              obs.observe( obj, { childList:true, subtree:true });
          }
          else if( eventListenerSupported ){
              obj.addEventListener('DOMNodeInserted', callback, false);
              obj.addEventListener('DOMNodeRemoved', callback, false);
          }
      }
  })();


  if (document.getElementById('contentArea') !== null) {
    console.log("working");
    observeDOM( document.getElementById('contentArea') ,function(){

        console.log("DOM CHANGED");

    });
  }
});
更新:似乎问题在于facebook如何加载页面(请参阅:)

有没有办法通过AJAX检测这些单独的变化

现在的问题是,如果我在Facebook上导航到另一个页面,比如单击主页按钮,突变观察者将停止工作,即使这个新页面中存在具有相同id的div

对,因为即使它有相同的
id
,它也是一个不同的元素

如果你想观察新元素的变异事件,你必须设置一个观察新元素的变异观察者,可能通过响应Chrome的“页面加载”事件。如果脚本在页面加载之间持续,您还需要确保释放上一个观察者

所以我假设当我通过点击主页按钮导航到一个新的facebook页面时,它会自动触发,但这并没有发生


我不会假设,我会假设它会在注入的页面上运行,而不是在任何其他页面上运行。确保在页面加载完成时运行扩展的地址。

没有代码的情况下“关于如何修复此问题的想法?”?可能不会。请看一看,并通读,特别是这是一个内容脚本,因为我的代码是包装在文档中的。准备好了吗?它不应该每次加载页面时都运行吗?我认为问题在于facebook如何加载页面。例如,在我的控制台中,如果我在其他网站(如github)上通过单击我的控制台日志“Navigated to…”的链接从github.com导航到repo,则在我的控制台中选中保留日志。然而,如果我在Facebook主页上,说我通过点击他们的链接导航到Facebook群组,它不会显示“导航到…”,这让我假设浏览器认为这些是相同的页面。