The URL interface represents an object providing static methods used for creating object URLs.
When using a user agent where no constructor has been implemented yet, it is possible to access such an object using the Window.URL
properties (prefixed with Webkit-based browser as Window.webkitURL
).
URL is used to parse, construct, normalise, and encode URLs.
The constructor takes a 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 will be encoded as per RFC 3986:
url.pathname = 'démonstration.html'; console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"
The 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 var parsedUrl = new URL(window.location.href); console.log(parsedUrl.searchParams.get("id")); // 123
The toString method of URL
is the href
property, so the constructor can be used to normalise and encode a URL directly.
const response = await fetch(new URL('http://www.example.com/démonstration.html'));
URL()
URL
object composed from the given parameters.URL.hash
DOMString
containing a '#'
followed by the fragment identifier of the URL.URL.host
DOMString
containing the domain (that is the hostname) followed by (if a port was specified) a ':'
and the port of the URL.URL.hostname
DOMString
containing the domain of the URL.URL.href
DOMString
containing the whole URL.URL.origin
Read only
DOMString
containing the origin of the URL, that is its scheme, its domain and its port.URL.password
DOMString
containing the password specified before the domain name.URL.pathname
DOMString
containing an initial '/'
followed by the path of the URL.URL.port
DOMString
containing the port number of the URL.URL.protocol
DOMString
containing the protocol scheme of the URL, including the final ':'
.URL.search
DOMString
containing a '?'
followed by the parameters of the URL.URL.searchParams
Read only
URLSearchParams
object allowing to access the GET query arguments contained in the URL.URL.username
DOMString
containing the username specified before the domain name.The URL
interface implements methods defined in URLUtils
.
URLUtils.toString()
DOMString
containing the whole URL. It is a synonym for URLUtils.href
, though it can't be used to modify the value.URL.toJSON()
[available since Firefox v54]
DOMString
containing the whole URL. It returns the same string as the href
property.URL.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.URL.revokeObjectURL()
URL.createObjectURL()
.Specification | Status | Comment |
---|---|---|
File API The definition of 'URL' in that specification. | Working Draft | Added the static methods URL.createObjectURL() and URL.revokeObjectURL () . |
URL The definition of 'API' in that specification. | Living Standard | Initial definition (implements URLUtils ). |
Desktop | ||||||
---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | |
Basic support | 32
|
12 | 19
|
? | 19
|
7
|
URL() constructor |
Yes | 12 | 26 | ? — 11 | Yes | Yes |
createObjectURL
|
8 | 12 | 4
|
10 | 15 | 6 |
hash |
Yes | 13 | 22 | Yes | Yes | Yes |
host |
Yes | 13 | 22 | ? | Yes | Yes |
hostname |
Yes | 13 | 22 | ? | Yes | 10 |
href |
Yes | 13 | 22 | ? | Yes | 10 |
origin |
52 | 12
|
26
|
? | Yes
|
10
|
password |
52 | 12
|
26 | ? | Yes
|
10
|
pathname |
Yes | 13 | 53
|
? | Yes | 10 |
port |
Yes | 13 | 22 | ? | Yes | 10 |
protocol |
Yes | 13 | 22 | ? | Yes | 10 |
revokeObjectURL
|
8 | 12 | 4
|
10 | 15 | 6 |
search |
Yes | 13 | 53
|
? | Yes | 10 |
searchParams |
51 | 17 | 52 | No | Yes | 10 |
toJSON |
? | 17 | 54 | ? | ? | ? |
username |
52 | 12
|
26 | ? | Yes
|
10
|
Mobile | |||||||
---|---|---|---|---|---|---|---|
Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet | |
Basic support | 4.4
|
32
|
12 | 19
|
19
|
7
|
? |
URL() constructor |
Yes | Yes | 12 | 26 | Yes | Yes | ? |
createObjectURL
|
? | 18 | ? | 4
|
15 | 6 | ? |
hash |
Yes | Yes | Yes | 22 | ? | ? | ? |
host |
Yes | Yes | Yes | 22 | ? | ? | ? |
hostname |
Yes | Yes | Yes | 22 | ? | ? | ? |
href |
Yes | Yes | Yes | 22 | ? | ? | ? |
origin |
52 | 52 | 12
|
26
|
Yes
|
Yes
|
? |
password |
52 | 52 | 12
|
26 | Yes
|
Yes
|
? |
pathname |
Yes | Yes | ? | 53
|
? | ? | ? |
port |
Yes | Yes | ? | 22 | ? | ? | ? |
protocol |
Yes | Yes | ? | 22 | ? | ? | ? |
revokeObjectURL
|
? | 18 | ? | 4
|
15 | 6 | ? |
search |
Yes | Yes | ? | 53
|
? | ? | ? |
searchParams |
51 | 51 | ? | 52 | ? | ? | ? |
toJSON |
? | ? | ? | 54 | ? | ? | ? |
username |
52 | 52 | 12
|
26 | Yes
|
Yes
|
? |
URL
object: Window.URL
.URLSearchParams
.
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/URL