一、History对象

    1.History对象：window.history对象包含浏览器的历史(url)的集合。

    2.History方法：

      history.back()  与在浏览器点击后退按钮相同

      history.forward()  与在浏览器中点击按钮向前相同

      history.go()  进入历史中的某个页面   

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <a href= "index.html" >跳转到index</a>
         <button id= "btn"  onclick= "goIndex()" >按钮</button>
         <script>
             function  goIndex(){
                 history.forward();
             }
         </script>
     </body>
</html>
 
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <button id= "btn"  onclick= "toTest()" >按钮</button>
         <script>
             function  toTest(){
                 history.back();
             }
         </script>
     </body>
</html>

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <a href= "obindex.html" >跳转</a>
     </body>
</html>
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <form>
             <input type= "text"  id= "userName"  />
         </form>
         <button id= "btn"  onclick= "safe()" >按钮</button>
         <script>
             function  safe(){
                 var  name = document.getElementById( "userName" ).value;
                 if (name ==  "hello" ){
                     history.go(-1);
                 } else {
                     alert( "输入错误" );
                 }
             }
         </script>
     </body>
</html>