Javascript Course

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

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which HTML element can be used to embed a SWF flash content?
<object> <div> <script>
<object type="application/x-shockwave-flash" data="file.swf" width="500" height="250">
 <param name="src" value="file.swf" />
 Your browser not support SWF.
</object>
Which CSS pseudo-class adds a style to an input form field that has keyboard input focus?
:active :focus :hover
input:focus {
  background-color: #88fe88;
}
Click on the instruction which converts a JSON string into a JavaScript object.
JSON.stringify(javascript_object) object.toString() JSON.parse(json_string)
var jsnstr = '{"url": "http://coursesweb.net/", "title": "Web Development Courses"}';
var obj = JSON.parse(jsnstr);
alert(obj.url);
Indicate the PHP function which can be used to create or write a file on server.
fopen() file_put_contents() file_get_contents()
if (file_put_contents("file.txt", "content")) echo "The file was created";
else echo "The file can not be created";
Get Domain Name and other Data from URL

Last accessed pages

  1. Using v-model in form input fields (1051)
  2. jQuery UI draggable - Drag elements (11445)
  3. Display data from PHP Array, or MySQL in HTML table (26980)
  4. Redirects (4978)
  5. jsSHA - SHA Hashes and HMAC in JavaScript (3519)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (310)
  2. The Mastery of Love (48)
  3. CSS cursor property - Custom Cursors (36)
  4. Read Excel file data in PHP - PhpExcelReader (35)
  5. PHP-MySQL free course, online tutorials PHP MySQL code (31)