就业培训     下载中心     Wiki     联络
登录   注册
  1. 首页
  2. Web API
  3. URL

在此页

URL interface is used to parse, construct, normalize, and encode URL . It works by providing properties which allow you to easily read and modify the components of a URL. You normally create a new URL object by specifying the URL as a string when calling its constructor, or by providing a relative URL and a base URL. You can then easily read the parsed components of the URL or make changes to the URL.

If a browser doesn't yet support the URL() constructor, you can access a URL object using the Window 接口的 Window.URL property. Be sure to check to see if any of your target browsers require this to be prefixed.

注意： 此特征可用于 Web 工作者 .

构造函数

new URL()
创建并返回 URL object referencing the URL specified using an absolute URL string, or a relative URL string and a base URL string.

特性

hash
USVString 包含 '#' followed by the fragment identifier of the URL.
host
USVString containing the domain (that is the hostname ) followed by (if a port was specified) a ':' 和 port of the URL.
hostname
USVString 包含 URL 的域。
href
A stringifier that returns a USVString containing the whole URL.
origin 只读
返回 USVString containing the origin of the URL, that is its scheme, its domain and its port.
password
USVString containing the password specified before the domain name.
pathname
USVString 包含初始 '/' followed by the path of the URL.
port
USVString 包含 URL 的端口号。
协议
USVString 包含 URL 的协议方案，包括最终的 ':' .
search
USVString indicating the URL's parameter string; if any parameters are provided, this string includes all of them, beginning with the leading ? 字符。
searchParams 只读
URLSearchParams object which can be used to access the individual query parameters found in search .
username
USVString containing the username specified before the domain name.

方法

toString()
返回 USVString containing the whole URL. It is a synonym for URL.href , though it can't be used to modify the value.
toJSON()
返回 USVString containing the whole URL. It returns the same string as the href 特性。

静态方法

createObjectURL()
返回 DOMString containing a unique blob URL, that is a URL with blob: as its scheme, followed by an opaque string uniquely identifying the object in the browser.
revokeObjectURL()
Revokes an object URL previously created using URL.createObjectURL() .

用法注意事项

构造函数接受 url parameter, and an optional base parameter to use as a base if the url parameter is a relative URL: 

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

URL properties can be set to construct the URL: 

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

URLs are encoded according to the rules found in RFC 3986 。例如： 

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

URLSearchParams interface can be used to build and manipulate the URL query string.

To get the search params from the current window's URL, you can do this: 

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

toString() 方法为 URL just returns the value of the href property, so the constructor can be used to normalize and encode a URL directly. 

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

规范

规范 状态 注释
文件 API
The definition of 'URL' in that specification. 		工作草案 Added the static methods URL.createObjectURL() and URL.revokeObjectURL () .
URL
The definition of 'API' in that specification. 		实时标准 Initial definition (implements URLUtils ).

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据
桌面 移动
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
URL Chrome 32
32
19 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Edge 12 Firefox 19
19
Before version 57, Firefox had a bug whereby single quotes contained in URLs are escaped when accessed via URL APIs (see bug 1386683 ).
To use it from chrome code, JSM and Bootstrap scope, you have to import it with Cu.importGlobalProperties(['URL']); .
IE 10 Opera 19
19
15 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Safari 7
7
6 Prefixed
Prefixed Implemented with the vendor prefix: webkit
WebView Android 4.4
4.4
4 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Chrome Android 32
32
25 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Firefox Android 19
19
Before version 57, Firefox had a bug whereby single quotes contained in URLs are escaped when accessed via URL APIs (see bug 1386683 ).
To use it from chrome code, JSM and Bootstrap scope, you have to import it with Cu.importGlobalProperties(['URL']); .
Opera Android 19
19
14 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Safari iOS 7
7
6 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Samsung Internet Android 2.0
2.0
1.5 Prefixed
Prefixed Implemented with the vendor prefix: webkit
URL() 构造函数 Chrome 19 Edge 12 Firefox 26 IE No Opera 15 Safari 6 WebView Android ≤37 Chrome Android 25 Firefox Android 26 Opera Android 14 Safari iOS 6 Samsung Internet Android 1.5
createObjectURL Chrome 19 Edge 12 Firefox 19
19
createObjectURL() is no longer available within the context of a ServiceWorker .
IE 10
10
If the underlying object does not have a content type set, using this URL as the src of an img tag fails intermittently with error DOM7009.
Opera 15 Safari 6 WebView Android Yes Chrome Android 25 Firefox Android 19
19
createObjectURL() is no longer available within the context of a ServiceWorker .
Opera Android 14 Safari iOS 6 Samsung Internet Android 1.5
hash Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
host Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
hostname Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
href Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
origin Chrome 32 Edge 12 Firefox 26
26
不支持 26 — 49
Results for URL 使用 blob scheme incorrectly returned null .
IE No Opera Yes Safari 10 WebView Android ≤37 Chrome Android 32 Firefox Android 26
26
不支持 26 — 49
Results for URL 使用 blob scheme incorrectly returned null .
Opera Android Yes Safari iOS Yes Samsung Internet Android 6.0
password Chrome 32 Edge 12 Firefox 26 IE No Opera Yes Safari 10 WebView Android ≤37 Chrome Android 32 Firefox Android 26 Opera Android Yes Safari iOS Yes Samsung Internet Android 6.0
pathname Chrome Yes Edge 13 Firefox 53
53
不支持 22 — 53
pathname and search returned the wrong values so that for a URL of http://z.com/x?a=true&b=false , pathname would return "/x?a=true&b=false" and search would return "", rather than "/x" and "?a=true&b=false" respectively.
IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 53
53
不支持 22 — 53
pathname and search returned the wrong values so that for a URL of http://z.com/x?a=true&b=false , pathname would return "/x?a=true&b=false" and search would return "", rather than "/x" and "?a=true&b=false" respectively.
Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
port Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
协议 Chrome Yes Edge 13 Firefox 22 IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 22 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
revokeObjectURL Chrome 19 Edge 12 Firefox 19
19
revokeObjectURL() is no longer available within the context of a ServiceWorker .
IE 10 Opera 15 Safari 6 WebView Android ≤37 Chrome Android 25 Firefox Android 19
19
revokeObjectURL() is no longer available within the context of a ServiceWorker .
Opera Android 14 Safari iOS 6 Samsung Internet Android 1.5
search Chrome Yes Edge 13 Firefox 53
53
不支持 22 — 53
pathname and search returned the wrong values so that for a URL of http://z.com/x?a=true&b=false , pathname would return "/x?a=true&b=false" and search would return "", rather than "/x" and "?a=true&b=false" respectively.
IE No Opera Yes Safari 10 WebView Android Yes Chrome Android Yes Firefox Android 53
53
不支持 22 — 53
pathname and search returned the wrong values so that for a URL of http://z.com/x?a=true&b=false , pathname would return "/x?a=true&b=false" and search would return "", rather than "/x" and "?a=true&b=false" respectively.
Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
searchParams Chrome 51 Edge 17 Firefox 29 IE No Opera 38 Safari 10 WebView Android 51 Chrome Android 51 Firefox Android 29 Opera Android 41 Safari iOS 10 Samsung Internet Android 5.0
toJSON Chrome 71 Edge 17 Firefox 54 IE No Opera Yes Safari Yes WebView Android 71 Chrome Android 71 Firefox Android 54 Opera Android Yes Safari iOS Yes Samsung Internet Android 10.0
toString Chrome 19 Edge 17 Firefox 54 IE No Opera Yes Safari Yes WebView Android ≤37 Chrome Android 25 Firefox Android 54 Opera Android Yes Safari iOS Yes Samsung Internet Android 6.0
username Chrome 32 Edge 12 Firefox 26 IE No Opera Yes Safari 10 WebView Android ≤37 Chrome Android 32 Firefox Android 26 Opera Android Yes Safari iOS Yes Samsung Internet Android 6.0

图例

完整支持

完整支持

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

见实现注意事项。

要求使用供应商前缀或不同名称。

要求使用供应商前缀或不同名称。

另请参阅

元数据

  • 最后修改：
  1. URL API
  2. URL
  3. 构造函数
    1. URL()
  4. 特性
    1. hash
    2. host
    3. hostname
    4. href
    5. origin
    6. password
    7. pathname
    8. port
    9. 协议
    10. search
    11. searchParams
    12. username
  5. 方法
    1. createObjectURL()
    2. revokeObjectURL()
    3. toJSON()
    4. toString()
  6. Related pages for URL API
    1. HTMLHyperlinkElementUtils
    2. URLSearchParams
    3. URLUtilsReadOnly

版权所有  © 2014-2026 乐数软件    

工业和信息化部： 粤ICP备14079481号-1