【发布时间】：2015-08-21 20:01:22
【问题描述】：
我想知道是否可以使用 MutationObserver 来监控 window.location.pathname（或 window.location.hash）的变化。
【问题讨论】：
标签： javascript
【发布时间】：2015-08-21 20:01:22
【问题描述】：
变异观察者观察的是 DOM，而不是对象，与这里无关。
对象观察者不能观察location.hash，不能因为location是系统对象或安全风险，但因为hash是内部管理的综合属性相当于 getter 和 setter。
在您的情况下，您不需要任何这些。您可以使用 popState 事件观察哈希变化。
window.onpopstate=function() { console.log("foo"); };
location.hash = "bar";
"foo"
我不知道您关注location.pathname 的变化的意图是什么。这将在您的处理程序有机会做任何事情之前导致页面重新加载。
【讨论】：
不 - 你不能使用 MutationObservers
新的 EcmaScript 7（预览版，草稿）将拥有Object.observe，这将允许您监控任何对象。但是，这行不通：观察全局对象存在安全风险，我怀疑任何浏览器都会允许这样做 (Chromium issue 494574)。
另外，正如其他人指出的那样，window.location 是一个系统对象（位置对象类型），因此Object.observe 没有涵盖它。
您可以使用已经支持 Object.observe 的 Chrome 43 进行测试：kangax.github.io/compat-table/es7/#Object.observe
所以唯一的解决方案是使用超时机制观察变化或使用window.onpopstate（如果您只需要监控哈希）。
【讨论】：
-
实际上，您可以观察全局对象（窗口除外），包括
location，作为快速测试将验证。你不能做的是观察location.hash和大多数其他属性或location，因为它们不是常规属性。 -
无法使用 Object.observe() 观察 window.location 的原因是 window.location 返回一个 Location Object 类型的对象（这是特殊的只读接口）而不是“标准" 对象。
-
实际上，我观察到了
location，它适用于foo等非标准属性。它只是不适用于hash等“神奇”属性。 -
你提到的ticket指的是
window，确实不是不可观察，不是window.location。 -
仅供阅读此旧答案的其他人使用：
Object.observe一直是deprecated，我目前不确定是否有替代方案可以涵盖这种情况。
window.location.path 不是 DOM 的一部分，因此不能在其上使用 MutationObservers。
但您可以执行“脏检查”：
function watchPathChanges () {
var currentPath = window.location.pathname;
setInterval({
if(window.location.pathname !== currentPath) {
currentPath = window.location.pathname;
//do something when it has changed
}
}, 50);
}
使用 EcmaScript 7，Object.observe() 原生支持监视属性更改：
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/observe
【讨论】：
-
因此可以使用 Object.observe() 来观察 window.location。那是对的吗？ Chrome 43 似乎已经支持它：kangax.github.io/compat-table/es7/#Object.observe
-
现在大多数浏览器都在使用 EcmaScript 5，ES6 计划在今年推出，我不知道 ES7 何时可用。如果您希望您的代码适用于当今所有的浏览器，请不要使用 Object.observe()
-
我很困惑。如果路径名发生变化，在下次检查之前不会重新加载页面吗？
-
不一定。如果 pushState 由 JavaScript 处理，就像在单页应用程序中一样，则不会重新加载页面。