In this lesson are presented other JavaScript level one browser objects: location and screen.

1. location object

The location object is a member of the window object, provides access to the current URL and its components. It is accessed through the window.location property.

location object properties


- The falowing example gets and writes in the page the parts of a given URL.
<script type="text/javascript"><!--
// considering the url of the page:
// - http://coursesweb.net:80/css/index.php?pg=tutorialsid=89#coms

// gets the parts
var protl = window.location.protocol;
var host_port = window.location.host;
var domain = window.location.hostname;
var port = window.location.port;
var dir_path = window.location.pathname;
var src = window.location.search;
var hsh = window.location.hash;

// writes the parts
document.write('protocol - '+ protl+ '<br />');
document.write('host - '+ host_port+ '<br />');
document.write('hostname - '+ domain+ '<br />');
document.write('port - '+ port+ '<br />');
document.write('pathname - '+ dir_path+ '<br />');
document.write('search - '+ src+ '<br />');
document.write('hash - '+ hsh+ '<br />');
--></script>
<button onclick="goBack()">Go Back 2</button>
- This script will display:
protocol - http:
host - coursesweb.net:80
hostname - coursesweb.net
port - 80
pathname - /css/index.php
search - ?pg=tutorialsid=89
hash - #coms

location object methods


2. screen objects

The screen object contains information about the visitor's screen, it's part of the window object.

screen objects properties


- Example with the value returned by some of these properties:
<script type="text/javascript"><!--
document.write('availHeight - '+ screen.availHeight+ '<br />');
document.write('availWidth - '+ screen.availWidth+ '<br />');
document.write('colorDepth - '+ screen.colorDepth+ '<br />');
document.write('pixelDepth - '+ screen.pixelDepth+ '<br />');
document.write('height - '+ screen.height+ '<br />');
document.write('width - '+ screen.width+ '<br />');
document.write('left - '+ screen.left+ '<br />');
document.write('top - '+ screen.top+ '<br />');
--></script>
- The output of the code above:
availHeight - 772
availWidth - 1280
colorDepth - 24
pixelDepth - 24
height - 800
width - 1280
left - 0
top - 0

• The screen object has no methods.

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag adds a new line into a paragraph?
<b> <br> <p>
First line ...<br>
Other line...
Which CSS property can be used to add space between letters?
text-size word-spacing letter-spacing
#id {
  letter-spacing: 2px;
}
What JavaScript function can be used to get access to HTML element with a specified ID?
getElementById() getElementsByTagName() createElement()
var elm = document.getElementById("theID");
var content = elm.innerHTML;
alert(content);
Click on the "echo" correct instruction.
echo "CoursesWeb.net" echo "CoursesWeb.net"; echo ""CoursesWeb.net";
echo "Address URL: http://CoursesWeb.net";
location and screen

Last accessed pages

  1. Butterfly Kyodai (10286)
  2. The Rise Of Atlantis (2122)
  3. Farms of Dreams (506)
  4. Qwop (7980)
  5. Action Games (3059)

Top accessed pages

  1. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (49280)
  2. Read Excel file data in PHP - PhpExcelReader (37621)
  3. PHP-MySQL free course, online tutorials PHP MySQL code (36682)
  4. Get Attribute (ID, Class, Name, Title, Src) with jQuery (33121)
  5. PHP PDO - exec (INSERT, UPDATE, DELETE) MySQL (30485)