history对象的使用--JavaScript基础

Posted Thanlon

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了history对象的使用--JavaScript基础相关的知识,希望对你有一定的参考价值。

history对象提供与历史清单有关的信息,包含最经访问过的10个网页的URL

1、history对象常用属性

length 返回浏览器历史列表中URL数量

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>history对象的length属性</title>
</head>
<body>
</body>
<script>
  document.write("<li>"+history.length);
</script>
</html>

2、history对象常用方法

1)back()方法

 该方法的功能是在浏览器中显示上一页,相当于go(-1)

firstPage.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>这是第一个页面</title>
</head>
<body>
  <span>这是第一个页面</span>
  <a href="secondPage.html">去上第二个页面</a>
</body>
</html>

secondPage.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>这是第二个页面</title>
</head>
<body>
  <span>这是第二个页面</span>
  <p><a href="#" onclick="javascript:window.history.back()">back()返回到上个页面</a></p>
  <p><a href="#" onclick="Javascript:window.history.go(-1)">go(-1)返回到上个页面</a></p>
</body>
</html>

图示:

 

2)forward()方法

该方法的功能是在浏览器中显示下一页,相当于go(1)

3)go(int)方法

 该方法的功能是在浏览器中载入从当前算起的第int个页面(int为整数),如果int为负,表示往回,相当于返回。

以上是关于history对象的使用--JavaScript基础的主要内容,如果未能解决你的问题,请参考以下文章

javascript History 对象总结

Java入门到架构师教程之JavaScript:history对象和location对象JavaScript设计模式系统讲解与应用

javascript History对象详解

javascript history对象

javascript History对象属性和方法

JavaScript 之 history对象