如何使用（或可能）使用MutationObserver监视window.location.pathname的更改？

Question

我想知道是否可以使用MutationObserver监视window.location.pathname（或window.location.hash）中的更改。

Answer 1

变异观察者观察的是 DOM，而不是对象，因此与此无关。

对象观察者不能观察location.hash，不是因为它location是一个系统对象或安全风险，而是因为它hash是一个由 getter 和 setter 等价物在内部管理的合成属性。

在您的情况下，您不需要任何这些。您可以使用popStateevent监视哈希更改。

window.onpopstate=function() { console.log("foo"); };

location.hash = "bar";
"foo"

我不知道您在观察location.pathname. 这将导致在您的处理程序有机会做任何事情之前重新加载页面。

Answer 2

不 - 你不能使用 MutationObservers

新的 EcmaScript 7（预览版、草稿版）将Object.observe允许您监视任何对象。然而，这是行不通的：观察全局对象存在安全风险，我怀疑任何浏览器都会允许这样做（Chromium 问题 494574）。

另外，正如其他人指出的那样，window.location 是一个系统对象（Location 对象类型），因此它不被 覆盖Object.observe。

您可以使用已经支持 Object.observe 的 Chrome 43 进行测试：kangax.github.io/compat-table/es7/#Object.observe

所以唯一的解决方案是使用超时机制来监视更改或使用window.onpopstate（如果您只需要监视哈希值）。