js 操作location URL对象进行操作

蔚落 2021-09-07 06:13 430阅读 0赞

把location 创建URL对象

## [构造器][Link 1] ##

[`new URL()`][new URL]

创建并返回一个`URL`对象，该URL对象引用使用绝对URL字符串，相对URL字符串和基本URL字符串指定的URL。

## [属性][Link 2] ##

[`hash`][hash]

包含`'#'`的[`USVString`][USVString]，后跟URL的片段标识符。

[`host`][host]

一个[`USVString`][USVString]，其中包含域（即主机名），后跟（如果指定了端口）“：”和URL的端口。

[`hostname`][hostname]

包含 URL 域名的 [`USVString`][USVString]。

[`href`][href]

包含完整 URL 的 [`USVString`][USVString]。

[`origin`][origin] 只读

返回一个包含协议名、域名和端口号的 [`USVString`][USVString]。

[`password`][password]

包含在域名前面指定的密码的  [`USVString`][USVString] 。

[`pathname`][pathname]

以 '/' 起头紧跟着 URL 文件路径的 [`DOMString`][DOMString]。

[`port`][port]

包含 URL 端口号的 [`USVString`][USVString]。

[`protocol`][protocol]

包含 URL 协议名的 [`USVString`][USVString]，末尾带 `':'。`

[`search`][search]

一个[`USVString`][USVString] ，指示URL的参数字符串； 如果提供了任何参数，则此字符串包括所有参数，并以开头的“？”开头 字符。

[`searchParams`][searchParams] 只读

[`URLSearchParams`][URLSearchParams]对象，可用于访问`search`中找到的各个查询参数。

[`username`][username]

包含在域名前面指定的用户名的 [`USVString`][USVString]。

例如

new URL(location.href).searchParams.get('year')
    // Returns 2008 for href = "http://localhost/search.php?year=2008".
    // Or in two steps:
    const params = new URL(location.href).searchParams;
    const year = params.get('year');

URLSearchParams.append()
    // 插入一个指定的键/值对作为新的搜索参数。
    URLSearchParams.delete()
    // 从搜索参数列表里删除指定的搜索参数及其对应的值。
    URLSearchParams.entries()
    // 返回一个iterator可以遍历所有键/值对的对象。
    URLSearchParams.get()
    // 获取指定搜索参数的第一个值。
    URLSearchParams.getAll()
    // 获取指定搜索参数的所有值，返回是一个数组。
    URLSearchParams.has()
    // 返回 Boolean 判断是否存在此搜索参数。
    URLSearchParams.keys()
    // 返回iterator 此对象包含了键/值对的所有键名。
    URLSearchParams.set()
    // 设置一个搜索参数的新值，假如原来有多个值将删除其他所有的值。
    URLSearchParams.sort()
    // 按键名排序。
    URLSearchParams.toString()
    // 返回搜索参数组成的字符串，可直接使用在URL上。
    URLSearchParams.values()
    // 返回iterator 此对象包含了键/值对的所有值。

[Link 1]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL#%E6%9E%84%E9%80%A0%E5%99%A8
[new URL]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/URL
[Link 2]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL#%E5%B1%9E%E6%80%A7
[hash]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/hash
[USVString]: https://developer.mozilla.org/zh-CN/docs/Web/API/USVString
[host]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/host
[hostname]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/hostname
[href]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/href
[origin]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/origin
[password]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/password
[pathname]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/pathname
[DOMString]: https://developer.mozilla.org/zh-CN/docs/Web/API/DOMString
[port]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/port
[protocol]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/protocol
[search]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/search
[searchParams]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/searchParams
[URLSearchParams]: https://developer.mozilla.org/zh-CN/docs/Web/API/URLSearchParams
[username]: https://developer.mozilla.org/zh-CN/docs/Web/API/URL/username