在javascript和锚点中使用URL哈希

Question

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

但是，我们想知道将其与“真实” HTML锚链接混合的最佳方法。 即指向页面上特定html ID的链接，例如#chapter-5 。

我们是否应该使用javascript实现跳转到正确的位置并停止依赖默认浏览器行为？ 例如，链接到#chapter=chapter-5&highlight=free并处理javascript中的过滤器和锚点？ 还是有一种安全/标准的方法来“混合”锚和自定义哈希？

Answer 1

如果您的目标环境允许，那么“安全/标准方式”将是使用常规哈希值（通常被称为“ hashbang”）方法将哈希值留给常规页内锚定，而使用现代HTML5历史API代替 。

如果您必须支持较旧的浏览器，则可以使用一些可以重新填充该哈希值的polyfill。

Answer 2

到目前为止，对该问题的评论可能是最有用的，因此我们选择实现锚点跳转并处理javascript中#之后的所有内容，而不是依赖于浏览器中的内置支持。

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