Frame Object
By: aathishankaran Printer Friendly Format
The frame, object is essentially the same element as a
window object, and you can deal with it in a similar manner. If you are working
with a single window, the window object is the top-level object. If you are
working within a frameset, the top-level window is considered the parent window,
whereas its child windows are considered frame objects.
Location Object
The location object encapsulates the URL of the current
page. It’s enabling you to
- Set the location object to move to a new URL.
- Extract specific elements of the URL and work with them. Without the location object, you would be forced to perform string manipulations on a URL string to get at the information you need.
The
basic structure of a URL is as follows:
protocol//hostname:
port pathname search hash
A
typical URL could look something like the following:
http://www.java-samples.com/showtutorial.php?tutorialid=180
Attribute |
Description |
href |
Complete
URL |
protocol |
Initial
element of a URL (before and including colon) |
hostname |
Host
and domain name or IP address |
host |
Hostname:
port element of a URL |
port |
Communications
port of the server |
pathname |
Path
element of a URL |
search |
Query
definition portion of a URL (begins with a 7) |
hash |
Anchor
name of a URL (begins with an #) |
History
Object
If you have surfed the Web at all, you are probably very
familiar with a browser's history list. Just as the history list allows a user
to traverse where she has been, JavaScript's history object enables you as a
JavaScript developer to maneuver through Web pages that have been visited.
Determining the Size of the list
You can use the length () property of the history object to
determine the number of entries in the list. For example, suppose you want to
track the number of history list entries in the right frame of a multiframe
window. The left frame contains the following code:
<HTML>
<HEAD>
<SCRIPT
LANGUAGE = "JavaScript">
function
moveon()
{
var
urlAddress = " " urlAddress = document.forms [0].Edit1.value
parent.frames[1].location
= urlAddress document.forms[0].Edit2.value
=
parent. frames [1] .history.length
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT
type="text" name="Edit1">
<INPUT
type="button" value="move" onClick="moveon()">
<INPUT
type="text" name="Edit2">
</FORM>
</BODY>
</HTML>
The user can use the Edit1 text object to enter a URL to
move to. As the user clicks the Move button to move to the URL, the Edit2 text
object is updated to provide the length of the history list for the right frame.
Navigating the History List
Just knowing the length of the history list is rarely
useful, but it can become useful when you want to navigate a list using the
history object methods back (), forward(), and go ().
Back Page
The back () method is the functional equivalent of clicking
the back (left-arrow) button on the browser's toolbar. For example, the
following code moves a window to its previous position:
window.history.back()
Forward Page
As you would expect, the forward () method is the same as
clicking the right arrow button on the browser's toolbar. It is used as follows:
window.history.forward()
Specific Page Based on Number
The go () method jumps to a specific place in the history
list. Its syntax follows:
[window.]history.go(delta
| "location")
The delta parameter is a positive or negative integer that
can specify the number of places to jump. For example, the following line moves
to the next document in the history list
(the
equivalent of using the forward () method):
window.history.go(l)
The
following list details the delta value:
delta < 0 Moves backward delta number of entries
delta> 0 Moves forward delta number of entries
delta
=0 Reloads the current document
Comment on this tutorial
- Data Science
- Android
- AJAX
- ASP.net
- C
- C++
- C#
- Cocoa
- Cloud Computing
- HTML5
- Java
- Javascript
- JSF
- JSP
- J2ME
- Java Beans
- EJB
- JDBC
- Linux
- Mac OS X
- iPhone
- MySQL
- Office 365
- Perl
- PHP
- Python
- Ruby
- VB.net
- Hibernate
- Struts
- SAP
- Trends
- Tech Reviews
- WebServices
- XML
- Certification
- Interview