URL - Web API 接口参考 编辑

URL接口用于解析，构造，规范化和编码 URLs。 它通过提供允许您轻松阅读和修改URL组件的属性来工作。 通常，通过在调用URL的构造函数时将URL指定为字符串或提供相对URL和基本URL来创建新的URL对象。 然后，您可以轻松读取URL的已解析组成部分或对URL进行更改。

如果浏览器尚不支持URL()构造函数，则可以使用Window中的Window.URL属性。 确保检查您的任何目标浏览器是否要求对此添加前缀。

构造器

new URL()

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

属性

hash

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

host

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

hostname

包含 URL 域名的 USVString。

href

包含完整 URL 的 USVString。

origin 只读

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

password

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

pathname

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

port

包含 URL 端口号的 USVString。

protocol

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

search

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

searchParams 只读

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

username

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

方法

toString()

返回包含整个URL的USVString。 它是URL.href的同义词，尽管它不能用于修改值。

toJSON()

返回包含整个URL的USVString。 它返回与href属性相同的字符串。

静态方法

createObjectURL()

返回一个DOMString ，包含一个唯一的blob链接（该链接协议为以blob:，后跟唯一标识浏览器中的对象的掩码）。

revokeObjectURL()

销毁之前使用URL.createObjectURL()方法创建的URL实例。

使用说明

如果url参数是相对URL，则构造函数将使用url参数和可选的base参数作为基础。

const url = new URL('../cats', 'http://www.example.com/dogs');
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/cats"

可以设置URL属性以构造URL：

url.hash = 'tabby';
console.log(url.href); // "http://www.example.com/cats#tabby"

URL根据 RFC 3986中的规则进行编码。 例如：

url.pathname = 'démonstration.html';
console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"

URLSearchParams接口可用于构建和处理URL查询字符串。

要从当前窗口的URL获取搜索参数，可以执行以下操作：

// https://some.site/?id=123
const parsedUrl = new URL(window.location.href);
console.log(parsedUrl.searchParams.get("id")); // "123"

URL的toString()方法仅返回href 属性的值，因此构造函数可以 用于直接对URL进行规范化和编码。

const response = await fetch(new URL('http://www.example.com/démonstration.html'));

规范

浏览器兼容性

BCD tables only load in the browser

此页面上的兼容性表是根据结构化数据生成的。 如果您想提供数据，请查看https://github.com/mdn/browser-compat-data并向我们发送请求请求。

相关链接

• URL API
• What is a URL?
• Property to obtain a URL object: Window.URL.
• URLSearchParams.