在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 ，因此將來可能會使用它。