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. Ubantu下编译Linux Kernel

    wget https://www.kernel.org/pub/linux/kernel/v3.x/linux-3.9.3.tar.gztar -xzf linux-3.9.3.tar.gzcd li ...

  2. Oracle start with connect by prior 用法

    Oracle start with connect by prior 用法    语法: select * from 表名 where 条件1 start with 条件2 connect by pr ...

  3. DTO学习系列之AutoMapper（六）----EntityFramework和AutoMapper的婚后生活

    写在前面 我到底是什么? 越界的可怕 做好自己 后记 文章标题主要关键字:mapping DTOs to Entities,注意并不是“Entities to DTOs”,表示实体对象到DTO的转换, ...

  4. PDO LIMIT bug

    PDO存在一个LIMIT BUG(mysql) 需要指定数据类型,而且limit后面跟的2个参数必须是数值类型,不然的话获取不到数据 例1: $dsn = "mysql:host=127.0 ...

  5. web api 返回数据XML JSON

    WEBAPI返回的数据格式一般是XML和JSON.能根据请求的要求返回.经过试验如下: public object Get(string uid) { return new {msg="成功 ...

  6. 利用JavaScript 的formdata 进行无刷新上传文件

          <html>     <head>         <title></title>         <script type=&quo ...

  7. 搬寝室（HDU 1421 DP）

    搬寝室 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submiss ...

  8. 关于svcutil.exe

    添加环境变量 name NETFX4 value C:\Program Files\Microsoft SDKs\Windows\v7.0A\bin\NETFX 4.0 Tools Server.Pr ...

  9. /users/products.:format 这种写法的其对应解析字符写法

    “products.:format" 这种写法可以有对应的下面两种路由形式 /products.json /products.xml "products.:format?" ...

  10. POJ 2152 Fire(树形DP)

    题意: 思路:令F[i][j]表示 的最小费用.Best[i]表示以i为根节点的子树多有节点都找到负责消防站的最小费用. 好难的题... #include<algorithm> #incl ...