DOM Location Object Properties
DOM Location Object – Part 1
Forward: In this part of the series, we look at DOM Location Object Properties.
By: Chrysanthus Date Published: 31 Jul 2012
Introduction
Note: If you cannot see the code or if you think anything is missing (broken link, image absent, etc.), just contact me at forchatrans@yahoo.com. That is, contact me for the slightest problem you have about what you are reading.
The DOM Location Object
The DOM Location Object is an object from which you can get information about the URL of the document currently displayed. You can also use it to load other documents. The object has properties that you can use to get the different parts of the current URL. The loading of a different document is achieved with the use of its methods. In this part of the series, we look at the properties of the object. In the next part of the series, we shall look at the methods of the object.
Accessing a Location Object Property
You access the location property as follows:
location.propertyName
You begin by typing the name of the object, then a dot and then the property name.
The location property deals with the URL of the web page currently displayed. So the script to get the URL information needs to have been in the page that is currently displayed.
The hash Property
When a URL is activated, the fragment identifier leads the user to an html element with the same ID. When a web page is displayed, the hash property can be used to return the fragment identifier of a URL. Assume that the URL to an html document and element is,
http://www.somesite.com/dir/page.htm#P1
Assume that you have the following code in the document:
<script type="text/ECMAScript">
alert(location.hash);
</script>
The alert box will display, “#P1”. The hash property has been used as follows:
location.hash
The host property returns the hostname (e.g. google.com) and port number (default is 80) of the URL of the currently displayed page. The syntax is:
location.host
The href Property
The href property returns the entire URL of the currently displayed web page. The syntax is:
location.href
The pathname Property
Assume that the URL of the currently displayed page is,
http://www.somesite.com/dir/page.htm#P1
Then the path name is,
/dir/page.htm
The path name is the portion of the complete URL between the domain portion and the fragment identifier.
The syntax for the path name is,
location.pathname
The port Property
The port property returns the port number of the URL. This is the port number the server uses for a URL; the default is 80. The syntax is:
location.port
The protocol Property
The protocol property returns the protocol of the URL of the web page that is currently displayed. Assume that the URL of the web page that is currently displayed is,
http://www.somesite.com/dir/page.htm#P1
Then the protocol returned is, “http:”, including the colon. The syntax to get the protocol from the URL is,
location.protocol
The search property returns the query portion of the URL of the currently displayed web page. Assume that the URL is,
http://www.somesite.com/dir/page.htm?firstname=John&lastname=Smith
Then the query portion is, ?firstname=John&lastname=Smith . The query portion is data beginning from the ? sign and to the right. The syntax to get the query portion is,
location.search
That is it for this part of the series. We stop here and continue in the next part.
Chrys
Related Links
Major in Website DesignWeb Development Course
HTML Course
CSS Course
ECMAScript Course
NEXT