History 对象
history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。
窗口被打开的那一刻开始记录,每个浏览器窗口、每个标签页乃至每个框架,都有自己的history对象与特定的window对象关联。

语法:

window.history.[属性|方法]
//window可以省略。

History 对象属性

History 对象方法

使用length属性,当前窗口的浏览历史总长度,代码如下:

 <script type="text/javascript">
  var HL = window.history.length;
  document.write(HL);
</script>

返回前一个浏览的页面
back()方法,加载 history 列表中的前一个 URL。

语法:

window.history.back();

比如,返回前一个浏览的页面,代码如下:

window.history.back();
//注意:等同于点击浏览器的倒退按钮。

back()相当于go(-1),代码如下:

window.history.go(-1);

例:

 <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
function GoBack() {
window.history.back();
}
</script>
</head>
<body>
点击下面的锚点链接,添加历史列表项:
<br />
<a href="#target1">第一个锚点</a>
<a name="target1"></a>
<br />
<a href="#target2">第二个锚点</a>
<a name="target2"></a>
<br /><br />
使用下面按钮,实现返回前一个页面:
<form>
<input type="button" value="返回前一个页面" onclick="GoBack();" />
</form>
</body>
</html>

返回浏览历史中的其他页面
go()方法,根据当前所处的页面,加载 history 列表中的某个具体的页面。

语法:

window.history.go(number);

参数:
  1  --- 前一个,go(1)等价forward()
  0  --- 当前页面
  -1 --- 后一个,go(-1)等价back()
  其他数值 --- 要访问的URL在history的URL列表中的相对位置。

浏览器中,返回当前页面之前浏览过的第二个历史页面,代码如下:

window.history.go(-2);

和在浏览器中单击两次后退按钮操作一样。
同理,返回当前页面之后浏览过的第三个历史页面,代码如下:

window.history.go(3);

例:

 <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
function GoBack() {
history.go(-1);
} function GoForward() {
history.go(2);
}
</script>
</head>
<body>
点击下面的锚点链接,添加历史列表项:
<br />
<a href="#target1">第一个锚点</a>
<a name="target1"></a>
<br />
<a href="#target2">第二个锚点</a>
<a name="target2"></a>
<br /><br />
使用下面按钮,实现返回前或下一个页面:
<form>
<input type="button" value="返回前一个页面" onclick="GoBack();" />
<input type="button" value="返回下一个页面" onclick="GoForward();" />
</form>
</body>
</html>
 
 

Javascript进阶篇——浏览器对象—History对象的更多相关文章

  1. 6、JavaScript进阶篇③——浏览器对象、Dom对象

    一.浏览器对象 1. window对象 window对象是BOM的核心,window对象指当前的浏览器窗口. window对象方法: 注意:在JavaScript基础篇中,已讲解了部分属性,windo ...

  2. 二、JavaScript语言--JS基础--JavaScript进阶篇--浏览器对象

    1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口. window对象方法:

  3. Javascript进阶篇——浏览器对象—Location、Navigator、userAgent、screen对象

    Location对象location用于获取或设置窗体的URL,并且可以用于解析URL.语法: location.[属性|方法] location对象属性图示: location 对象属性: loca ...

  4. Javascript进阶篇——浏览器对象—JavaScript计时器

    ---恢复内容开始--- JavaScript 计时器在JavaScript中,我们可以在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行.计时器类型:一次性计时器:仅在指定的延迟时间之后触 ...

  5. JS window对象 History 对象 history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。语法: window.history.[属性|方法]

    History 对象 history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能. 注意:从窗口被打开的那一刻开始记录,每个浏览器窗口.每个标签页乃至每个框架,都 ...

  6. #笔记#JavaScript进阶篇一

    #JavaScript进阶篇 http://www.imooc.com/learn/10 #认识DOM #window对象 浏览器窗口可视区域监测—— 在不同浏览器(PC)都实用的 JavaScrip ...

  7. 4、JavaScript进阶篇①——基础语法

    一.认识JS 你知道吗,Web前端开发师需要掌握什么技术?也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HTML+CSS创建一个漂亮的页面,但这还不够,它只是静态页面 ...

  8. 【叔小生】JavaScript进阶篇

    如何插入JS JS基础语法 语法.函数.方法 提取字符串substring() substring() 方法用于提取字符串中介于两个指定下标之间的字符. <!DOCTYPE HTML> & ...

  9. JS BOM对象 History对象 Location对象

    一.BOM对象 BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作 window对象 所有浏览器都支持 window 对象. 概念上讲.一个html文档对应一个window对象. 功能上讲: 控 ...

随机推荐

  1. oracle学习笔记(二)表的查询

    --oracle表的管理 --创建表 )); --删除表 drop table users; --创建表 ),xm ),sex ),birthday date,sal ,)); ),cnmae )); ...

  2. Web C# 导出Excel 方法总结

    方法1:微软推荐服务器需安装Excel型 依赖: 软件:Office Excel 2007-2013 引用:Microsoft Office 14.0 Object Library 1.1 数据准备 ...

  3. mysql-5.7.12-winx64.zip Windows (x86, 64-bit), ZIP Archive版免安装配置

    1.下载免安装版压缩包 下载地址:http://dev.mysql.com/downloads/mysql/ 选择符合你的操作系统的版本,点击download进入下载页面 不用注册也可以点击下载连接进 ...

  4. <转>请戒掉成功学和正能量,那是麻痹人的毒药 | 新知

    非常不幸的是,这将是一场非常糟糕的演说.我不想骗你们,你们从我这里几乎什么也学不到.你们在离开的时候肯定会感到失望,你们的生活并不会得到改善. 更糟糕的是,你还会意识到生活的本质毫无意义,你的一切努力 ...

  5. 关于(x&y)+((x^y)>>1)的探究

    今天在程序员面试宝典上看到 int f(int x int y ) { return (x&y)+((x^y)>>1) } f(729,271) 结果为500 从式子中可以看出分为 ...

  6. <c:if>标签

    <c:if>的用途就和我们一般在程序中用的if一样. 语法 语法1:没有本体内容(body) <c:if test="testCondition" var=&qu ...

  7. Angry Professor

    def main(): t = int(raw_input()) for _ in range(t): n, k = map(int, raw_input().strip().split(' ')) ...

  8. 答:我们公司的ASP.NET 笔试题,你觉得难度如何

    闲来无事,逛逛园子,发现有个面试题,觉得有意思.已自己的理解答来看看,不足之处,请多指教. 原文地址:http://www.cnblogs.com/leotsai/p/aspnet-tests-for ...

  9. CoreData (三)备

    NSFetchedResultsController 什么是NSFetchedResultsController NSFetchedResultsController是一个让人爱恨交加的一个类.如果使 ...

  10. 分布式文件系统glusterfs安装步骤

    我的系统是 RHEL5 , 可能环境不一样, 需要安装的第三方依赖不一样啊, 反正大家在安装的过程中缺少什么就去安装什么, 一般都会有提示的. 下载   glusterfs-3.2.0.tar.gz  ...