在 javascript 和锚点中使用 URL 哈希

using URL hashes in javascript AND anchors

我们在应用程序的某些地方使用 URL 哈希来过滤显示,例如#highlight=free 将突出显示我们的免费内容。我们使用javascript来处理hash,监听hash的变化。一切都很好。

不过,我们想知道将其与 "real" HTML 锚点 link 混合使用的最佳方式。即 links 指向页面上特定的 html id,例如#chapter-5.

我们是否应该使用 javascript 实现跳转到正确的位置并停止依赖默认的浏览器行为?例如,link 到 #chapter=chapter-5&highlight=free 并在 javascript 中处理过滤器和锚点?或者是否有 safe/standard 方法来 "mix" 锚点和自定义哈希?

如果您的目标环境允许,那么 "safe/standard way" 将保留带有老式哈希(通常被视为 "hashbang")的哈希方法单独用于常规页内锚点并使用现代HTML5 history API instead.

如果您必须支持较旧的浏览器,您可以使用一些 polyfill 返回到该哈希值的浏览器。

这个问题的评论可能是迄今为止最有帮助的,所以我们选择实现锚点跳转并处理 javascript 中 # 之后的所有内容,而不是依赖内置 -在浏览器中支持它。

对于那些感兴趣的人,我们使用 jquery.deparam、URI.js 和一些自定义代码的组合来监听哈希变化并挂接到我们自己的函数中。我们还玩了 Hasher.js,看起来不错,所以我们将来可能会用到它。