使用jQuery獲取當前網(wǎng)頁URL的完整指南

本指南提供jQuery代碼片段，用于獲取當前網(wǎng)頁的完整URL并將其存儲在一個變量中，以便與其他腳本一起使用。此URL與您在地址欄中看到的URL相同。

以下代碼片段演示了如何使用jQuery和純JavaScript獲取當前頁面的URL：

$(document).ready(function() {
    // 使用jQuery
    var url = $(location).attr('href');

    // 使用純JavaScript
    var url2 = window.location.href;

    // 在警告窗口中顯示URL
    alert(url); //或者 alert(url2);
});

此外，以下函數(shù)在確定絕對路徑時可能會有所幫助：

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}

常見問題解答 (FAQs)

如何在jQuery中獲取當前URL？

在jQuery中獲取當前URL，可以使用window.location.href屬性。此屬性返回當前頁面的URL。以下是一個簡單的示例：

$(document).ready(function(){
  var currentURL = window.location.href;
  console.log(currentURL);
});

這段代碼將當前URL獲取并存儲在currentURL變量中，然后console.log(currentURL)將此URL打印到控制臺。

如何在jQuery中獲取不包含查詢字符串的當前URL？

可以使用window.location.origin和window.location.pathname屬性來獲取不包含查詢字符串的當前URL。示例如下：

$(document).ready(function(){
  var currentURL = window.location.origin + window.location.pathname;
  console.log(currentURL);
});

這段代碼獲取URL的來源（協(xié)議、主機名和端口）和路徑名，并將這兩個部分連接起來，形成不包含查詢字符串的URL。

如何在jQuery中從當前URL獲取查詢字符串？

可以使用window.location.search屬性來獲取查詢字符串，該屬性返回查詢字符串，包括開頭的問號。示例如下：

$(document).ready(function(){
  var queryString = window.location.search;
  console.log(queryString);
});

這段代碼獲取查詢字符串并將其存儲在queryString變量中，然后console.log(queryString)將此查詢字符串打印到控制臺。

如何在jQuery中獲取不包含哈希值的當前URL？

可以使用window.location.href屬性和split()方法來獲取不包含哈希值的當前URL。示例如下：

$(document).ready(function(){
  var currentURL = window.location.href.split('#')[0];
  console.log(currentURL);
});

這段代碼獲取當前URL，并在哈希符號（#）處將其分割。[0]部分獲取分割URL的第一部分，即不包含哈希值的URL。

如何在jQuery中獲取當前URL的哈希值？

可以使用window.location.hash屬性來獲取當前URL的哈希值。此屬性返回哈希值，包括開頭的哈希符號。示例如下：

$(document).ready(function(){
  var hash = window.location.hash;
  console.log(hash);
});

這段代碼獲取哈希值并將其存儲在hash變量中，然后console.log(hash)將此哈希值打印到控制臺。

如何在jQuery中更改當前URL而不重新加載頁面？

可以使用history.pushState()方法在jQuery中更改當前URL而不重新加載頁面。此方法將新條目推入歷史堆棧。示例如下：

$(document).ready(function(){
  history.pushState(null, null, '/new-page.html');
});

這段代碼將當前URL更改為/new-page.html，而不會重新加載頁面。

如何在jQuery中獲取當前URL的協(xié)議？

可以使用window.location.protocol屬性來獲取當前URL的協(xié)議。此屬性返回URL的協(xié)議，包括尾部的冒號。示例如下：

$(document).ready(function() {
    // 使用jQuery
    var url = $(location).attr('href');

    // 使用純JavaScript
    var url2 = window.location.href;

    // 在警告窗口中顯示URL
    alert(url); //或者 alert(url2);
});

這段代碼獲取協(xié)議并將其存儲在protocol變量中，然后console.log(protocol)將此協(xié)議打印到控制臺。

如何在jQuery中獲取當前URL的主機名？

可以使用window.location.hostname屬性來獲取當前URL的主機名。此屬性返回URL的主機名。示例如下：

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}

這段代碼獲取主機名并將其存儲在hostname變量中，然后console.log(hostname)將此主機名打印到控制臺。

如何在jQuery中獲取當前URL的端口？

可以使用window.location.port屬性來獲取當前URL的端口。此屬性返回URL的端口。示例如下：

$(document).ready(function(){
  var currentURL = window.location.href;
  console.log(currentURL);
});

這段代碼獲取端口并將其存儲在port變量中，然后console.log(port)將此端口打印到控制臺。

如何在jQuery中獲取當前URL的路徑名？

可以使用window.location.pathname屬性來獲取當前URL的路徑名。此屬性返回URL的路徑名。示例如下：

$(document).ready(function(){
  var currentURL = window.location.origin + window.location.pathname;
  console.log(currentURL);
});

這段代碼獲取路徑名并將其存儲在pathname變量中，然后console.log(pathname)將此路徑名打印到控制臺。

通過這些方法，您可以輕松地在jQuery中獲取和操作當前網(wǎng)頁的URL的不同部分。 記住根據(jù)您的具體需求選擇合適的方法。

以上是jQuery獲取當前頁面URL的詳細內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！