Location对象的知识点回顾

前端

2024-02-20 20:00:23

Location对象简介

Location对象是浏览器中一个内置对象，它表示当前页面的URL地址。您可以通过window.location访问该对象。Location对象包含了许多属性和方法，可用于获取和操作URL的各个部分。

Location对象属性

Location对象包含以下属性：

href：URL的完整地址。
protocol：URL的协议，例如"http"或"https"。
host：URL的主机名和端口号。
hostname：URL的主机名。
port：URL的端口号。
pathname：URL的路径。
search：URL的查询字符串。
hash：URL的哈希值。

Location对象方法

Location对象包含以下方法：

assign()：将当前页面的URL地址更改为指定的值。
reload()：重新加载当前页面。
replace()：将当前页面的URL地址替换为指定的值，但不将该值添加到浏览器的历史记录中。

Location对象示例

以下是一些Location对象的使用示例：

// 获取当前页面的URL
const url = window.location.href;

// 获取当前页面的协议
const protocol = window.location.protocol;

// 获取当前页面的主机名和端口号
const host = window.location.host;

// 获取当前页面的主机名
const hostname = window.location.hostname;

// 获取当前页面的端口号
const port = window.location.port;

// 获取当前页面的路径
const pathname = window.location.pathname;

// 获取当前页面的查询字符串
const search = window.location.search;

// 获取当前页面的哈希值
const hash = window.location.hash;

// 将当前页面的URL地址更改为指定的值
window.location.assign('https://www.example.com');

// 重新加载当前页面
window.location.reload();

// 将当前页面的URL地址替换为指定的值，但不将该值添加到浏览器的历史记录中
window.location.replace('https://www.example.com');