History 历史记录

一. history 是什么？

window上的一个对象，由来存储浏览器访问过的历史

二. 用途：

可以动态跳转任意一个已在历史记录中的地址

三. history方法：

1.forward() : 向后翻一页

back(): 回退一页
go(num) : num为负值时表示回退 num为正值时表示前进
pushState(data, title, url): 添加一条历史记录，受同源策略限制，添加历史纪录后页面地址改变但是页面不会更新——H5新增的方法 IE9以下不兼容
replaceState(data, title, url) 替换当前的历史记录，受同源策略限制，添加历史纪录后页面地址改变但是页面不会更新 —— H5新增的方法 IE9以下不兼容

四. history事件：

1.popstate: 每次地址改变时触发，注：pushSate和replaceState的时候不会触发该事件。只有当用户点击回退或前进按钮或者调用back , forward, go方法才会触发这个事件

2.hashchange: 地址栏中hash值改变的时候会触发

data：一个与指定网址相关的状态对象，popstate事件触发时，该对象会传入回调函数中。如果不需要这个对象，此处可以填null。 title：新页面的标题，但是所有浏览器目前都忽略这个值，因此这里可以填null。 url：新的网址，必须与当前页面处在同一个域。浏览器的地址栏将显示这个网址。

案例1：

history.forward() //前进一页

history.back() //回退一页

history,go(2) // 前进两页

history.go(-2) // 回退两页

console.log(history.length) // 打印挡墙历史记录的条数

案例2：

以下代码在服务器环境下

假设当前网址为http://localhost/index.html 使用pushState在历史记录里面添加一条历史记录

history.pushState({

page: ‘page1’

}, ‘page-1’, ‘./page.html’);

打开当前的地址，会发现页面里面显示的内容为index.html里面的内容但是地址变为http://localhost/page.html ,这是因为pushState是向历史记录添加一条记录但是不会刷新页面。点击回退按钮地址栏会变化为index.html

即： pushState方法不会触发页面刷新，只是导致history对象发生变化，地址栏的显示地址发生变化

案例3：

假设当前网址为http://localhost/index.html 使用replaceState在历史记录里面替换一条历史记录

history.pushState({

page: ‘page1’

}, ‘page-1’, ‘./page.html’);

打开当前的地址，会发现页面里面显示的内容为index.html里面的内容但是地址变为http://localhost/page.html ,点击回退按钮不会跳转到index.html页面，这是因为replaceState是在历史记录里面替换当前的记录，页面仍然不会刷新。

即： replaceState方法不会触发页面刷新，只是导致history对象发生变化，地址栏的显示地址发生变化

History 历史记录相关推荐

syslog记录history历史记录
工作中可能会有无聊的***在你服务器上转悠,***智商都不错,所有离开的时候就会删除history记录.怎么办才能记录下用户的历史记录呢? 原理:将history记录到syslog上面,并实时的传送到 ...
前端：JS/24/BOM和DOM简介，for...in循环遍历，window对象的属性和方法，延时器，定时器，screen屏幕对象，location地址栏对象，history历史记录对象
BOM 和DOM简介 BOM ,Browser Object Model ,浏览器对象模型: BOM主要提供了访问和操作浏览器各组件的方式: 浏览器组件:window(浏览器容器), location ...
history历史记录
history方法与属性 history.pushState(对象,'标题','新增历史记录') 不刷新页面的情况下添加历史记录 history.replaceState(对象,'标题','替换的历 ...
History 历史记录加入时间等信息
1.命令历史记录中加时间默认情况下如下图所示,没有命令执行时间,不利于审计分析. 通过设置export HISTTIMEFORMAT='%F %T ',让历史记录中带上命令执行时间. 注意" ...
linux设置history历史记录
#说明 export HISTSIZE=1000 #设置历史记录显示1000行 export HISTTIMEFORMAT='%F %T ' #设置历史记录格式 999 2017-08-15 10:5 ...
linux查看历史的所有命令,linux查询历史记录命令history的用法介绍
一.什么是history在bash功能中,它能记忆使用过的命令,这个功能最大的好处就是可以查询曾经做过的举动! 从而可以知道你的运行步骤,那么就可以追踪你曾下达过的命令,以作为除错的工具! 二.His ...
history的详解与使用
通过Linux下的history命令我们可以查看用过的命令,即历史命令,今天我们就来了解一下吧! 一.什么是history 在bash功能中,它能记忆使用过的命令,这个功能最大的好处就是可以查询曾经做 ...
C# 系统应用之清除Cookies、IE临时文件、历史记录转载
http://blog.csdn.net/Eastmount/article/details/18821221 本文主要是项目"个人电脑使用记录清除软件"系类文章中关于清除浏览器C ...
C# 系统应用之清除Cookies、IE临时文件、历史记录
本文主要是项目"个人电脑使用记录清除软件"系类文章中关于清除浏览器Cookies.IE临时文件.最近使用历史记录等内容.该篇文章的基本思想路线是首先了解上网历史记录的Windows ...

History 历史记录

History 历史记录相关推荐

最新文章

热门文章