The function presented in this page ( urlData() ) can be used to get /extract the
domain name and other data from URL address.
The function receives a string with the URL address, and returns an object containing these data:
Protocol, Page Path, File-name, search parts, port, and hash part.
•
Code of the function (click to select it):
// Extract data from URL address
// Returns an object with parts of the URL address:
// protocol, domain-name, port, path, file-name, search-string, search-object, hash
function urlData(url){ // From: https://coursesweb.net/javascript/
// object that will be returned
var re = {protocol:'', domain:'', port:80, path:'', file:'', search_str:'', search_obj:{}, hash:''};
// creates an anchor element, and adds the url in "href" attribute
var a_elm = document.createElement('a');
a_elm.href = url;
// adds URL data in re object, and returns it
re.protocol = a_elm.protocol.replace(':', '');
re.domain = a_elm.hostname.replace('www.', '');
if(a_elm.port !='') re.port = a_elm.port;
re.path = a_elm.pathname;
if(a_elm.pathname.match(/[^\/]+[\.][a-z0-9]+$/i) != null) re.file = a_elm.pathname.match(/[^\/]+[\.][a-z0-9]+$/i)[0];
re.search_str = a_elm.search.replace('?', '');
//get search-data into an object {name:value}, in case there are multiple pairs name=value
var src_data = re.search_str.split('&');
for(var i=0; i<src_data.length; i++){
var ar_val = src_data[i].split('='); //separate name and value from each pair
re.search_obj[ar_val[0]] = ar_val[1];
}
re.hash = a_elm.hash.replace('#', ''); //get #hash part
return re;
}
Example:
<div id="urld">Here it is added URL data.</div>
<script>
// Extract data from URL address
// Returns an object with parts of the URL address:
// protocol, domain-name, port, path, file-name, search-string, search-object, hash
function urlData(url){ // From: https://coursesweb.net/javascript/
// object that will be returned
var re = {protocol:'', domain:'', port:80, path:'', file:'', search_str:'', search_obj:{}, hash:''};
// creates an anchor element, and adds the url in "href" attribute
var a_elm = document.createElement('a');
a_elm.href = url;
// adds URL data in re object, and returns it
re.protocol = a_elm.protocol.replace(':', '');
re.domain = a_elm.hostname.replace('www.', '');
if(a_elm.port !='') re.port = a_elm.port;
re.path = a_elm.pathname;
if(a_elm.pathname.match(/[^\/]+[\.][a-z0-9]+$/i) != null) re.file = a_elm.pathname.match(/[^\/]+[\.][a-z0-9]+$/i)[0];
re.search_str = a_elm.search.replace('?', '');
//get search-data into an object {name:value}, in case there are multiple pairs name=value
var src_data = re.search_str.split('&');
for(var i=0; i<src_data.length; i++){
var ar_val = src_data[i].split('='); //separate name and value from each pair
re.search_obj[ar_val[0]] = ar_val[1];
}
re.hash = a_elm.hash.replace('#', ''); //get #hash part
return re;
}
// Test
var url = 'https://coursesweb.net:80/javascript/index.php?pg=tutorial&id=89#hash_part';
var url_data = urlData(url);
// displays URL data in #urld
document.getElementById('urld').innerHTML = 'protocol : '+ url_data.protocol +'<br>domain : '+ url_data.domain +'<br>port : '+ url_data.port +'<br>path : '+ url_data.path +'<br>file : '+ url_data.file +'<br>search_str : '+ url_data.search_str +'<br>search_obj : '+ JSON.stringify(url_data.search_obj) +'<br>hash : '+ url_data.hash;
</script>
Result:
protocol : http
domain : coursesweb.net
port : 80
path : /javascript/index.php
file : index.php
search_str : pg=tutorial&id=89
search_obj : {"pg":"tutorial", "id":"89"}
hash : hash_part