热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

关于HTML5historyAPI的介绍-

HTML5historyAPI介绍history是个全局变量,即window.history属性和方法如下:length:历史堆栈中的记录数。back():返回上一页。foward():前进到下一页。go([delta]):delta是数字,如果为0或为空则刷新本页,如果正数则前进[delta]页,如负数则后退[delta]页。HTML5添加了
HTML5 history API介绍

history是个全局变量,即window.history

属性和方法如下:

length:历史堆栈中的记录数。

back(): 返回上一页。

foward(): 前进到下一页。

go([delta]): delta是数字,如果为0或为空则刷新本页,如果正数则前进[delta]页,如负数则后退[delta]页。


HTML5添加了以下两个方法:

pushState(data, title, [,url]):在历史堆栈顶部插入一条记录。

data为一个对象或null,会在window的popstate事件(window.onpopstate)时,作为state参数传递过去。

title为页面的标题,当前所有浏览器都忽略这个参数。

url 为页面url,不写则为当前页。
replaceState(data, title, [,url]):更改当前页面的历史记录。这种更改不会去访问该URL。
replaceState()的URL参数必须和当前页的协议(如HTTP、HTTPS)和域名完全相同(使用不同的子域都不行)
目前只有Safari 5.0+、Chrome 8.0+、Firefox 4.0+和iOS 4.2.1+支持。如果想兼容老浏览器的话,可以试试History.js,而且它还修正了一些bug。
pushState 与 replaceState 使用:




 
  
  
  
 
 
  

page 1 page 2 page 3 page 4

window.onpopstate方法:

window.Onpopstate= function(event){
    alert(event.state);
}

本篇文章关于HTML5 history API 的介绍,更多相关内容请关注 第一PHP社区 。


推荐阅读
  • 理解浏览器历史记录(2)hashchange、pushState
    阅读目录1.hashchange2.pushState本文也是一篇基础文章。继上文之后,本打算去研究pushState,偶然在一些信息中发现了锚点变 ... [详细]
  • 探讨了在HTML表单中使用元素代替进行表单提交的方法。 ... [详细]
  • 本文提供了一个详尽的前端开发资源列表,涵盖了从基础入门到高级应用的各个方面,包括HTML5、CSS3、JavaScript框架及库、移动开发、API接口、工具与插件等。 ... [详细]
  • 在使用 Nginx 作为服务器时,发现 Chrome 能正确从缓存中读取 CSS 和 JS 文件,而 Firefox 却无法有效利用缓存,导致加载速度显著变慢。 ... [详细]
  • 本文探讨了如何通过优化 DOM 操作来提升 JavaScript 的性能,包括使用 `createElement` 函数、动画元素、理解重绘事件及处理鼠标滚动事件等关键主题。 ... [详细]
  • 深入理解:AJAX学习指南
    本文详细探讨了AJAX的基本概念、工作原理及其在现代Web开发中的应用,旨在为初学者提供全面的学习资料。 ... [详细]
  • 深入解析WebP图片格式及其应用
    随着互联网技术的发展,无论是PC端还是移动端,图片数据流量占据了很大比重。尤其在高分辨率屏幕普及的背景下,如何在保证图片质量的同时减少文件大小,成为了亟待解决的问题。本文将详细介绍Google推出的WebP图片格式,探讨其在实际项目中的应用及优化策略。 ... [详细]
  • 本文总结了 #define 在 C/C++ 编程中的多种用途和技巧,包括定义常量、函数、宏以及条件编译等,并提供了详细的示例和注意事项。 ... [详细]
  • LeetCode 102 - 二叉树层次遍历详解
    本文详细解析了LeetCode第102题——二叉树的层次遍历问题,提供了C++语言的实现代码,并对算法的核心思想和具体步骤进行了深入讲解。 ... [详细]
  • 笔记说明重学前端是程劭非(winter)【前手机淘宝前端负责人】在极客时间开的一个专栏,每天10分钟,重构你的前端知识体系& ... [详细]
  • 本文详细介绍了五种常用的PHP排序算法——冒泡排序、选择排序、插入排序、希尔排序和堆排序。每种算法都附有代码示例,并通过打印和延时操作来直观展示排序过程。欢迎指出任何错误。 ... [详细]
  • 本文介绍了如何在 MongoDB 中使用正则表达式进行数据排除查询,特别关注了通过 $regex 和 $nin 操作符来过滤特定模式的数据。 ... [详细]
  • 吴石访谈:腾讯安全科恩实验室如何引领物联网安全研究
    腾讯安全科恩实验室曾两次成功破解特斯拉自动驾驶系统,并远程控制汽车,展示了其在汽车安全领域的强大实力。近日,该实验室负责人吴石接受了InfoQ的专访,详细介绍了团队未来的重点方向——物联网安全。 ... [详细]
  • 本文探讨了Node.js后端开发的基础知识,包括模块源码的使用方法、前后端源码的区别以及如何在命令行环境中编译Node.js源代码。 ... [详细]
  • Requests库的基本使用方法
    本文介绍了Python中Requests库的基础用法,包括如何安装、GET和POST请求的实现、如何处理Cookies和Headers,以及如何解析JSON响应。相比urllib库,Requests库提供了更为简洁高效的接口来处理HTTP请求。 ... [详细]
author-avatar
哒Dayling玲
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有