Created
April 20, 2012 13:29
-
-
Save jlong/2428561 to your computer and use it in GitHub Desktop.
URI Parsing with Javascript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var parser = document.createElement('a'); | |
parser.href = "http://example.com:3000/pathname/?search=test#hash"; | |
parser.protocol; // => "http:" | |
parser.hostname; // => "example.com" | |
parser.port; // => "3000" | |
parser.pathname; // => "/pathname/" | |
parser.search; // => "?search=test" | |
parser.hash; // => "#hash" | |
parser.host; // => "example.com:3000" |
Thanks for your sharing.
I LOVE this way, but I'm wondering is it better way than regex.
This is not URI parsing, only URL parsing.
additional you can get the origin at once:
parser.origin // => http://example.com
new URL('https://gist.github.com/jlong/2428561?foo=bar#test')
The Best
new URL('https://gist.github.com/jlong/2428561?foo=bar#test')
The Best
Note that this will only worl with full absolute URLs and throw an error with for example new URL('options.php')
:
TypeError: options.php is not a valid URL.
While the createElement-solution also takes relative URLs (although the result you get back will be a full URL):
let urlParser = document.createElement("a");
urlParser.href = 'options.php';
urlParser.hash = 'foobar';
console.log(urlParser.href);
console.log(urlParser.getAttribute('href'));
// result of both logs is the full URL: https://example.com/options.php#foobar
parser.host and praser.hostname are available,
parser.host - return domain WITH the port ex: github.com
parser.hostname - return just domain ex: github.com:8080
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
this is gold