location.href的几种用法

**Location.href 的几种用法**

`location.href` 是 JavaScript 中的一个属性，用于获取或设置当前 URL 的 href 属性。它是 `window.location` 对象的一个属性，可以通过 `window.location.href` 来访问。

在本文中，我们将讨论 `location.href` 的几种常见用法，以及一些示例代码和注释。

###1. 获取当前 URL最简单的用法就是获取当前 URL 的 href 属性。例如：

javascriptconst currentUrl = location.href;
console.log(currentUrl); // 输出当前 URL

这段代码会输出当前网页的 URL，包括协议、域名、路径等信息。

###2. 设置新 URL除了获取当前 URL 之外，我们还可以通过 `location.href` 来设置新的 URL。例如：

javascriptlocation.href = ' />

这段代码会将当前网页的 URL 更改为指定的 URL。

注意：在设置新 URL 时，需要确保新 URL 是有效的 URL 格式，不然可能导致网页跳转错误或其他问题。

###3. 跳转到新 URL除了设置新的 URL 之外，我们还可以通过 `location.href` 来实现页面跳转。例如：

javascriptfunction jumpToNewPage() {
 location.href = ' />}

这段代码定义了一个函数，用于跳转到指定的新 URL。

###4. 获取 URL 的参数除了获取当前 URL 之外，我们还可以通过 `location.href` 来获取 URL 的参数。例如：

javascriptconst params = new URLSearchParams(location.search);
console.log(params.get('param1')); // 输出 param1 的值

这段代码会输出 URL 中的 `param1` 参数的值。

###5. 设置 URL 的参数除了获取 URL 的参数之外，我们还可以通过 `location.href` 来设置新的 URL 参数。例如：

javascriptconst params = new URLSearchParams(location.search);
params.set('newParam', 'newValue');
location.href += `&${params.toString()}`;

这段代码会将新参数添加到当前 URL 中。

###6. 删除 URL 的参数除了设置新的 URL 参数之外，我们还可以通过 `location.href` 来删除指定的 URL 参数。例如：

javascriptconst params = new URLSearchParams(location.search);
params.delete('param1');
location.href += `&${params.toString()}`;

这段代码会将 `param1` 参数从当前 URL 中删除。

###7. 重写 URL除了设置新的 URL 之外，我们还可以通过 `location.href` 来重写整个 URL。例如：

javascriptfunction rewriteUrl(newUrl) {
 location.href = newUrl;
}

这段代码定义了一个函数，用于重写当前 URL。

注意：在重写 URL 时，需要确保新 URL 是有效的 URL 格式，不然可能导致网页跳转错误或其他问题。

### 总结`location.href` 是 JavaScript 中的一个属性，用于获取或设置当前 URL 的 href 属性。它是 `window.location` 对象的一个属性，可以通过 `window.location.href` 来访问。在本文中，我们讨论了 `location.href` 的几种常见用法，以及一些示例代码和注释。

这些用法包括：

* 获取当前 URL* 设置新 URL* 跳转到新 URL* 获取 URL 的参数* 设置 URL 的参数* 删除 URL 的参数* 重写 URL每个用法都有其特定的场景和应用，了解它们可以帮助开发者更好地使用 `location.href` 属性。