一. Html4的History API

  1. back() 后退,跟按下“后退”键是等效的。
  2. forward() 前进,跟按下“前进”键是等效的。
  3. go() 用法:history.go(x);在历史的范围内去到指定的一个地址。如果 x < 0,则后退 x 个地址,如果 x > 0,则前进 x 个地址,如果 x == 0,则刷新现在打开的网页。history.go(0) 跟 location.reload() 是等效的。

二. Html5的History API

  1. history.pushState(data, title [, url]):往历史记录堆栈顶部添加一条记录;data会在onpopstate事件触发时作为参数传递过去;title为页面标题,当前所有浏览器都会 忽略此参数;url为页面地址,可选,缺省为当前页地址。

  2. history.replaceState(data, title [, url]) :更改当前的历史记录,参数同上。

3. history.state:用于存储以上方法的data数据,不同浏览器的读写权限不一样。

4. popstate事件:当用户单击浏览器的后退或者前进按钮时触发该事件。在事件处理函数中读取触发事件的事件对象的state属性值,该属性值即为执行pushState方法时所使用的第一个参数值,其中保存了在向浏览器历史记录中添加记录同步保存的对象。

Html5 history Api简介的更多相关文章

  1. window.history的跳转实质-HTML5 history API 解析

    在上一浏览器跳转行为的测试中,我们看到了通过不同的方法操作浏览器跳转时,它的刷新表现有所不同,在这一文章中,将看看,为何会产生这样的不同?其背后的实质是什么?浏览器的访问历史记录到底是如何运作的呢? ...

  2. html5 history api

    1.html5 history api适用场景,个人理解最大的用处是配合ajax使用,使ajax拥有回退.前进的用户体验. 2.代码(dive into html5中的一个小例子) 1)fer.htm ...

  3. HTML5 history API实践

    一.history API知识点总结 在HTML4中,我们已经可以使用window.history对象来控制历史记录的跳转,可以使用的方法包括: history.forward();//在历史记录中前 ...

  4. 转: html5 history api详解~很好的文章

    从Ajax翻页的问题说起 请想象你正在看一个视频下面的评论,在翻到十几页的时候,你发现一个写得稍长,但非常有趣的评论.正当你想要停下滚轮细看的时候,手残按到了F5.然后,页面刷新了,评论又回到了第一页 ...

  5. HTML5 History API & URL 重定向

    HTML5 History API & URL 重定向 disabled server url redirect https://developer.mozilla.org/en-US/doc ...

  6. HTML5 History API让ajax能回退到上一页

    HTML5 History API提供了一种功能,能让开发人员在不刷新整个页面的情况下修改站点的URL.这个功能很有用,例如通过一段JavaScript代码局部加载页面的内容,你希望通过改变当前页面的 ...

  7. HTML5 history API,创造更好的浏览体验

    HTML5 history API有什么用呢? 从Ajax翻页的问题说起 请想象你正在看一个视频下面的评论,在翻到十几页的时候,你发现一个写得稍长,但非常有趣的评论.正当你想要停下滚轮细看的时候,手残 ...

  8. 转:HTML5 History API 详解

    从Ajax翻页的问题说起 请想象你正在看一个视频下面的评论,在翻到十几页的时候,你发现一个写得稍长,但非常有趣的评论.正当你想要停下滚轮细看的时候,手残按到了F5.然后,页面刷新了,评论又回到了第一页 ...

  9. 一篇文章图文并茂地带你轻松实践 HTML5 history api

    HTML5 history api 前言 由于笔者在网络上没有找到比较好的关于 history api 的实践案例,有的案例过于杂乱,没有重点,有些案例只是告诉读者 api 是什么,却没告诉怎么用,本 ...

随机推荐

  1. {Python}安装第三方包(setup.py)

    在github上下载了records文件到本地. 解压文件 cmd切换到文件setup.py的目录下 先执行 python setup.py build 再执行python setup.py inst ...

  2. Docker学习系列(二):Docker三十分钟快速入门(上)

    一.背景 ​ 最近,Docker技术真是一片火热,它的出现也弥补了虚拟机资源消耗过高的问题,直接让虚拟化技术有了质的飞跃.那么本文我们来聊一聊Docker,和大家一起认识Docker,简单入门Dock ...

  3. 安装linux mint 18.3 后要做的

    使用u盘安装的linux mint 18.3,安装过程基本顺利 发现在安装过程中使用中文语言的话会使得下载附加软件的速度快很多 安装完成之后要做的事情有: 1.字体 默认的楷体字比较难看,在软件管理器 ...

  4. 08使用NanoPiM1Plus在Android4.4.2下接TF卡

    08使用NanoPiM1Plus在Android4.4.2下接TF卡 大文实验室/大文哥 壹捌陆捌零陆捌捌陆捌贰 21504965 AT qq.com 完成时间:2017/12/5 17:51 版本: ...

  5. 关于 VS 调用存储过程加载很慢和SQL 执行很快的那些事

    执行同样的存储过程,调用同样的参数 在VS 中调用存储过程和传参后,到数据加载需要20秒或更多, 在SQL直接调用则不到一秒,同一个存储过程为什么有这么大的区别呢? 原因:存储过程计划失效的原因 产生 ...

  6. Web应用程序的安全性问题依其存在的形势划分,种类繁多,这里不准备介绍所有的,只介绍常见的一些。

    Web应用程序的安全性问题依其存在的形势划分,种类繁多,这里不准备介绍所有的,只介绍常见的一些.  常见Web应用安全问题安全性问题的列表: 1.跨站脚本攻击(CSS or XSS, Cross Si ...

  7. Angular——配置模块与运行模块

    配置模块 通过config方法实现对模块的配置,AngularJS中的服务大部分都对应一个“provider”,用来执行与对应服务相同的功能或对其进行配置.比如$log.$http.$location ...

  8. ElasticSearch学习笔记--安装

    1.安装ElasticSearch https://www.elastic.co/guide/en/elasticsearch/reference/current/docs-index_.html 这 ...

  9. vue2.0路由(跳转和传参)经典介绍

    声明式 <router-link :to="...">编程式router.push(...) router.push('home')                 / ...

  10. Hive DDL&DML

    1.删除分区 ALTER TABLE table_name DROP IF EXISTS PARTITION(dt=') 如果是外部表,记得rm对应文件 2.添加分区 ALTER TABLE tabl ...