2

我需要的东西,以检测该URL的变化,但该页面没有做回传,它的变化动态地添加只是HTML中的DIV,所以URL页面是这样的发现变化的URL

http://www.examplepage/conversations/44455

,当我点击页面的其他部分也很

http://www.examplepage/conversations/44874

它不仅结束,但像这样

http://www.examplepage/settings

而不做回发,并重新加载的JavaScript,所以我的问题是改变,是有办法来检测这些变化?和事件监听器,但如何?

我搜索和大家说哈希事件,但我没有任何哈希后的任何值,因此它不工作

编辑

只是为了我没有网页的代码,也没有我的纪录有权访问,我会更好地解释,我正在做一个背景谷歌扩展,我只是添加一个幻灯片到现有的页面,这个页面以我上面解释的方式更改其网址。 url会像每个页面一样更改,但它们会更改html内部的div,以便页面不必再次收取所有内容。

+0

你可以设置一个时间间隔,只需检查网址,但一个想法就是找到改变网址并添加回调的代码。 –

+0

什么时候会对url进行更新?也许附加一个事件监听器,只要你期望一个URL更改检查新值 –

+0

@NickZuber当你点击一个元素来改变页面,例如在这里堆栈溢出,如果我点击作业或标签或用户(如果你点击一个它会重定向你到另一个页面在我的情况下它只是改变div和url而没有帖子回来) – FFHanzel

回答

12

您需要在页面加载时存储URL作为起点并检查每个n毫秒对于使用setInterval进行更改,然后根据该更改进行修改。

下面的代码做此检查两次,第二(500毫秒):

// store url on load 
var currentPage = window.location.href; 

// listen for changes 
setInterval(function() 
{ 
    if (currentPage != window.location.href) 
    { 
     // page has changed, set new page as 'current' 
     currentPage = window.location.href; 

     // do your thing... 
    } 
}, 500); 
+0

就像使用set Interval那么简单,但我试图寻找一个事件或更复杂的东西,但这个工程完美再次感谢! – FFHanzel

+1

当前唯一可用的侦听器是'window.onhashchange',在这种情况下它没有帮助,因为它在url中查找'#hash'更改。 – user5513314

+0

有没有'onstatechange'事件? –

4

没有“干净”的,基于事件的方法来检测从内容脚本,URL变化。

它们是用history.pushState API完成的 - 并且使用该API不会发出任何DOM事件。

两种可能间接基于事件的方法,除了已经提到的poll-based one

  1. 的分机可以忽略history.pushStateinjected script额外发射可在内容脚本听了DOM事件。

    该方法详细描述为here

    不利的一面是,根据页面代码的不同,注入的脚本可能需要提前注入,需要run_at: document_start,这对于页面加载性能而言是次优的。

  2. 使用听取chrome.webNavigation.onHistoryStateUpdated event的背景页。

    如果您需要在背景页面—完美, 您完成,没有需要内容脚本。

    如果您需要在内容脚本中检测到此内容,则可以在事件侦听器中使用details.tabId将消息发送到正确的内容脚本。