• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint

The history Object

The history object holds the record of the sites the web browser has visited before reaching the current page. It gives you access to methods that enable you to move back to previous pages.

Here’s an example putting the history object to work. In this case, I’ll use this object’s back, forward, and go methods to navigate forward and backward in the browser’s history, letting the user navigate one or two pages forward or backward (to navigate more than one page at a time, you use the go method):

(Listing 04-05.html on the web site)

<HTML> 
    <HEAD> 
        <TITLE>Using the history object</TITLE> 
    <SCRIPT LANGUAGE="JavaScript"> 
        <!--
        function back()
					{
					window.history.back()
					}
					function forward()
					{
					window.history.forward()
					}
					function back2()
					{
					window.history.go(-2)
					}
					function forward2()
					{
					window.history.go(2)
					} 
        // --> 
    </SCRIPT> 
    </HEAD> 

    <BODY> 
        <H1>Using the history object</H1> 
        <FORM> 
            <BR> 
            Click a button to go forward or back one page: 
            <BR> 
            <INPUT TYPE = BUTTON VALUE = "< Go back" ONCLICK = "back()"> 
            <INPUT TYPE = BUTTON VALUE = "Go forward >" ONCLICK = "forward()"> 
            <BR> 
            <BR> 
            Click a button to go forward or back two pages: 
            <BR> 
            <INPUT TYPE = BUTTON VALUE = "<< Go back 2" ONCLICK = "back2()"> 
            <INPUT TYPE = BUTTON VALUE = "Go forward 2 >>" ONCLICK = "forward2()"> 
        </FORM> 
    </BODY> 
</HTML> 

					  

You can see this code at work in Figure 4.6—simply clicking the buttons is just like clicking the browser’s forward and back buttons, except that we’re offering the user the option of moving two pages in either direction as well.

Figure 4.6. Navigating forward and backward.


You’ll find the properties and methods (there are no events) of the history object in Table 4.9. We’ll get all the details on browser version for each property, method, and event in Chapter 10.

Table 4.9. The Properties and Methods of the history Object
Properties Methods
current back
length forward
next go
previous 


  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint