JavaScript Tutorial/History/History

Материал из Web эксперт
Перейти к: навигация, поиск

History

The History object allows you to navigate through the history of Websites that a browser has displayed.

The browser stores a history of visited URLs in a list, which the History object references.

Properties and Methods of the History Object

Property Description back() Loads the URL for the previous visited Web site current Refers to the current URL in the history list forward() Loads the next URL in the history list go() Loads a URL from the history list length Returns the number of entries in the history list next Refers to the next URL in the history list previous Refers to the previous URL in the history list



   <source lang="javascript">

<html>

   <head>
   <title> Using the history object to view a list of the browser history</title>
   <script language="JavaScript">
   
   
   </head>
   <body>
   <script language="JavaScript">
   
   </script>
   </body>
   </html></source>
   
  

History.back()

The back() method is used to load the URL for the previously visited Web site.



   <source lang="javascript">

<html>

   <head>
   <title> Using the back method of the History object</title>
   </head>
   <body>
   <form name=form1>
   Click on the button to go back to the previous page.
   <input type="button" value="Go Back" onClick="window.history.back()">
   </form>
   </body>
   </html></source>
   
  

History.current

The current property contains a string that specifies the complete URL of the current history entry.



   <source lang="javascript">

<html>

   <head>
   <title> Using the current property of the History object</title>
   </head>
   <body>
   <script language="JavaScript">
   
   </script>
   <form name=form1>
   <input type="button" value="Get Current" onClick="alert(window.history.current)">
   </form>
   </body>
   </html></source>
   
  

History.forward()

The forward() method is used to load the URL for the next Web site in the history list.



   <source lang="javascript">

<html>

   <head>
   <title> Using the forward method of the History object</title>
   </head>
   <body>
   <form name=form1>
   Click on the button to go to the forward browser page.
   <input type="button" value="Go Forward" onClick="window.history.forward()">
   </form>
   </body>
   </html></source>
   
  

History.go()

Syntax



   <source lang="javascript">

history.go(num)</source>


History.go(-2)

   <source lang="javascript">

<html> <head> <title>History</title> </head> <body>

history object

<a href="" onclick="history.back();return false">history.back()</a>
<a href="" onclick="history.go(-2);return false">history.go(-2)</a>

<a href="" onclick="history.forward();return false">history.forward()</a>
</script> </body> </html></source>


History.length

The length property is used to get the number of URLs in the history list.



   <source lang="javascript">

<html>

   <head>
   <title> Using the length property of the History object</title>
   </head>
   <body>
   <script language="JavaScript">
   
   </script>
   </body>
   </html></source>
   
  

History.next

The next property is used to get the URL for the next entry in the history list.



   <source lang="javascript">

<html>

   <head>
   <title> Using the next property of the History object</title>
   </head>
   <body>
   <script language="JavaScript">
   
   </script>
   </body>
   </html></source>
   
  

History.previous

The previous property is used to get the URL for the previous entry in the history list.



   <source lang="javascript">

<html>

   <head>
   <title> Using the previous property of the History object</title>
   </head>
   <body>
   <script language="JavaScript">
   
   </script>
   <form name=form1>
   <input type="button" value="Get Previous" onClick="alert(window.history.previous)">
   </form>
   </body>
   </html></source>
   
  

Simulated Back and Forward Buttons by using the history object

   <source lang="javascript">

<html> <head> <title>Simulated Back and Forward Buttons</title> </head> <body>

Simulated Back and Forward Buttons

<a href="javascript:history.back()">Back</a> | <a href="javascript:history.forward()">Forward</a>

</body> </html></source>