如今，許多現(xiàn)代的網(wǎng)絡(luò)應(yīng)用都使用哈希網(wǎng)址 要在頁面上添加唯一性（例如頁面標(biāo)籤，部分，操作等），而無需刷新它可以識別它。這是從使用jQuery獲取URL參數(shù)將動態(tài)數(shù)據(jù)傳遞到通過URL傳遞到頁面的。它仍然在www上廣泛使用。

window.location.hash vs document.url

讓我們快速看一下這兩個正則是正則您可以使用它來抓住哈希標(biāo)籤。

<span>//using window.location.hash
</span>$<span>.fn.urlHash = function()
</span><span>{
</span>  <span>return window.location.hash.replace('#','');
</span><span>};
</span>$<span>.urlHash();</span>

重要的是：location.hash對IE不安全（包括IE9）。另外，如果您的頁麵包含一個iFrame，則在手動刷新IFRAME內(nèi)容內(nèi)的手動刷新後獲取舊位置。 hash值（首頁加載），而手動檢索值則與位置不同。

<span>//IE Proof - URL Hash Grab - returns complete hash value
</span>$<span>.fn.urlHash = function()
</span><span>{
</span>  <span>return document.URL.substr(document.URL.indexOf('#')+1);
</span><span>};
</span>$<span>.urlHash();</span>

因此，作為提取Dayofweek Hash標(biāo)籤值的示例，您會這樣做：

<span>//in context - extract dayofweek hash
</span><span>//eg  url#dayofweek1 would return 1
</span><span>if (document.URL.indexOf('#dayofweek'))
</span><span>{
</span>    week <span>= parseInt(document.URL.substr(document.URL.indexOf('#')+1).replace('dayofweek',''))-1;
</span>    $resParent<span>.eq(week).showResources();
</span><span>}</span>

>另一種不錯的方式

這是使用較重的正則表達(dá)式的另一種體面方法（磅標(biāo)牌是可選的，因為.match（）永遠(yuǎn)不會返回null）。

<span>var match = location.hash.match(<span>/<span>^#?(.*)$</span>/</span>)[1];
</span><span>if (match)
</span><span>{
</span>   <span>//do stuff...
</span><span>}</span>

失敗…

<span>var hash = location.hash.match(<span>/#<span>(w+)</span>/</span>)[1];</span>

問題：當(dāng)哈希中有任何非拉丁蛋白或非針源性特徵時，返回錯誤的結(jié)果。例如，對於Hash＃foo@o＃bar $％huh hello hello，只需返回“ foo”。 location.hash為空時拋出typeError，因為.match（）將返回null

<span>var hash = location.hash.split('#')[1];</span>

通過相同的測試哈希，它至少會得到“ foo@o”部分，這意味著只有在哈希包含磅標(biāo)誌時才失敗。當(dāng)沒有哈希時，它不會丟失錯誤，儘管它返回未定義而不是空字符串。

參考材料

獲取您的哈希 - 防彈方式

經(jīng)常詢問有關(guān)哈希url

的問題（常見問題解答）

什麼是哈希url，為什麼重要？

> hash url是一個包含哈希（＃）符號的URL，後跟標(biāo)識符。該標(biāo)識符用於指向網(wǎng)頁中的特定部分。哈希URL很重要，因為它們允許用戶直接導(dǎo)航到頁面上的特定內(nèi)容，而無需滾動整個頁面。這對於具有多個部分的長網(wǎng)頁特別有用。此外，可以使用哈希url來維持在單頁的Web應(yīng)用程序中的狀態(tài)，其中哈希更改以反映當(dāng)前視圖。

>

>如何創(chuàng)建哈希url？ URL非常簡單。您需要做的就是附加哈希（＃）符號，然後是您的URL標(biāo)識符。例如，如果您在www.example.com上有一個頁面，並且要創(chuàng)建一個指向“ extiral1”部分的哈希url，則您的哈希url將是www.example.com＃pection1。

>如何使用jQuery操縱哈希url？ “位置”對象的“哈?！睂傩钥捎渺东@取或設(shè)置URL的哈希部分。例如，要將哈希設(shè)置為“第1節(jié)”，您將使用location.hash ='Section1';。要獲取當(dāng)前的哈希，您將使用var hash = location.hash;。

>我可以將hash urls用於ajax導(dǎo)航嗎？

是的，可以將hash urls用於ajax導(dǎo)航。通過更改哈希，您可以加載不同的內(nèi)容而無需刷新頁面。這通常在單頁應(yīng)用程序中用於創(chuàng)建流暢的用戶體驗。

>如何檢測jQuery的哈希更改？

jQuery提供'Hashchange'事件，每當(dāng)hash觸發(fā)時更改。您可以在哈希更改時使用此事件運(yùn)行代碼。例如，$（window）.on（'hashchange'，function（）{ / *您的代碼在此處 * /}）;。

>使用哈希urls？雖然哈希網(wǎng)址可能非常有用，但仍有一些缺點(diǎn)。一個主要的缺點(diǎn)是，它們可能會引起搜索引擎優(yōu)化（SEO）的問題，因為搜索引擎可能無法索引與哈希相關(guān)的內(nèi)容。此外，哈希url可能會引起分析問題，因為它們並不總是被跟蹤為單獨(dú)的頁面視圖。

我可以使用帶有錨標(biāo)籤的哈希url嗎？

是的，是的，hash url經(jīng)常被用於hash urls。錨定標(biāo)籤創(chuàng)建“跳躍鏈接”，允許用戶直接導(dǎo)航到頁面的特定部分。 URL中的哈希對應(yīng)於錨標(biāo)記的“ ID”屬性。

>

>如何使用jQuery？

>您可以從URL中刪除哈希> >我可以使用hash url存儲狀態(tài)信息嗎？這通常用於單頁應(yīng)用程序，其中應(yīng)用程序的狀態(tài)存儲在哈希中。這允許用戶通過使用返回按鈕或通過為URL添加書籤來導(dǎo)航回同一狀態(tài)。

>

>我如何使用hash url進(jìn)行深層鏈接？

>深層鏈接是使用URL直接導(dǎo)航到頁面中的特定內(nèi)容。哈希網(wǎng)址是完美的，因為它們允許您直接鏈接到頁面的特定部分。要使用哈希url進(jìn)行深層鏈接，只需將本節(jié)的哈希和標(biāo)識符附加到您的URL。

以上是將哈希URL與jQuery示例一起使用的詳細(xì)內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！