new URL() 創(chuàng)建并返回一個(gè)URL對(duì)象
共 2070字,需瀏覽 5分鐘
·
2024-05-06 19:23
URL 接口用于解析,構(gòu)造,規(guī)范化和編碼 URL。它通過提供允許你輕松閱讀和修改 URL 組件的屬性來工作。通常,通過在調(diào)用 URL 的構(gòu)造函數(shù)時(shí)將 URL 指定為字符串或提供相對(duì) URL 和基本 URL 來創(chuàng)建新的 URL 對(duì)象。然后,你可以輕松讀取 URL 的已解析組成部分或?qū)?URL 進(jìn)行更改。
如果瀏覽器尚不支持URL()構(gòu)造函數(shù),則可以使用Window中的Window.URL屬性。確保檢查你的任何目標(biāo)瀏覽器是否要求對(duì)此添加前綴。
構(gòu)造器 new URL() 創(chuàng)建并返回一個(gè)URL對(duì)象,該 URL 對(duì)象引用使用絕對(duì) URL 字符串,相對(duì) URL 字符串和基本 URL 字符串指定的 URL。
屬性
hash 包含'#'的USVString,后跟 URL 的片段標(biāo)識(shí)符。
host 一個(gè)USVString,其中包含域(即主機(jī)名),后跟(如果指定了端口)“:”和 URL 的端口。
hostname 包含 URL 域名的 USVString。
href 包含完整 URL 的 USVString。
origin 只讀 返回一個(gè)包含協(xié)議名、域名和端口號(hào)的 USVString。
password 包含在域名前面指定的密碼的 USVString 。
pathname 以 '/' 起頭緊跟著 URL 文件路徑的 DOMString。
port 包含 URL 端口號(hào)的 USVString。
protocol 包含 URL 協(xié)議名的 USVString,末尾帶 ':'。
search 一個(gè)USVString ,指示 URL 的參數(shù)字符串;如果提供了任何參數(shù),則此字符串包括所有參數(shù),并以開頭的“?”開頭 字符。
searchParams 只讀 URLSearchParams對(duì)象,可用于訪問search中找到的各個(gè)查詢參數(shù)。
username 包含在域名前面指定的用戶名的 USVString。
方法
toString() 返回包含整個(gè) URL 的USVString。它是URL.href的同義詞,盡管它不能用于修改值。
toJSON() 返回包含整個(gè) URL 的USVString。它返回與href屬性相同的字符串。
靜態(tài)方法 createObjectURL() 返回一個(gè)DOMString ,包含一個(gè)唯一的 blob 鏈接(該鏈接協(xié)議為以 blob:,后跟唯一標(biāo)識(shí)瀏覽器中的對(duì)象的掩碼)。
revokeObjectURL() 銷毀之前使用URL.createObjectURL()方法創(chuàng)建的 URL 實(shí)例。
使用說明
如果url參數(shù)是相對(duì) URL,則構(gòu)造函數(shù)將使用url參數(shù)和可選的base參數(shù)作為基礎(chǔ)。
const url = new URL('../cats', 'http://www.example.com/dogs');console.log(url.hostname); // "www.example.com"console.log(url.pathname); // "/cats"
可以設(shè)置 URL 屬性以構(gòu)造 URL:
url.hash = 'tabby';console.log(url.href); // "http://www.example.com/cats#tabby"
URL 根據(jù) RFC 3986中的規(guī)則進(jìn)行編碼。例如:
url.pathname = 'démonstration.html';console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"
URLSearchParams接口可用于構(gòu)建和處理 URL 查詢字符串。
要從當(dāng)前窗口的 URL 獲取搜索參數(shù),可以執(zhí)行以下操作:
// https://some.site/?id=123const parsedUrl = new URL(window.location.href);console.log(parsedUrl.searchParams.get("id")); // "123"
URL 的toString()方法僅返回href 屬性的值,因此構(gòu)造函數(shù)可以 用于直接對(duì) URL 進(jìn)行規(guī)范化和編碼。
const response = await fetch(new URL('http://www.example.com/démonstration.html'));
