在首页点击视频后,会跳转到视频页面,但是该页面并无刷新,不是ajax,但是url地址已经变了,也不只是变了hash。那是怎样做到的?点击的时候顶部有进度条。也不是框架?如果更改了herf的值,页面就会整页跳转。那他是怎样做到的?
闭关修行中......
根据搜索结果,貌似在10年(或许更早,HTML5草案是08年提出的,而草案的前身是在04年提出的...)国外公司就有很多应用了,而...在今天之前,我只知道AJAX...
history API中有几个新特性,分别是history.pushState和history.replaceState,我们把pushState+AJAX进行封装,合起来简单点叫,就是PJAX
history API
history.pushState
history.replaceState
pushState+AJAX
PJAX
pjax是对ajax + pushState的封装,让你可以很方便的使用pushState技术。http://barretlee.com/history-api-in-html5/
PJAX的基本思路是,用户点击一个链接,通过ajax更新页面变化的部分,然后使用HTML5的pushState修改浏览器的URL地址,这样有效地避免了整个页面的重新加载。如果浏览器不支持history的两个新API或者JS被禁用了,那这个链接就只能跳转并重新刷新整个页面了。和传统的ajax设计稍微不同,ajax通常是从后台获取JSON数据,然后由前端解析渲染,而PJAX请求的是一个在服务器上生成好的HTML碎片
Pjax的操作流程:
1.用ajax加载新内容。 2.用history.pushState将原来的页面加入历史记录。 3.加载完成新页面后,用history.replaceState方法修改当前的url。 4.使用document.title修改当前页的标题。
ajax
url
document.title
百度:PJAX
ajax取内容 history api改变状态 简称pjax
根据搜索结果,貌似在10年(或许更早,HTML5草案是08年提出的,而草案的前身是在04年提出的...)国外公司就有很多应用了,而...在今天之前,我只知道AJAX...
pjax是对ajax + pushState的封装,让你可以很方便的使用pushState技术。
http://barretlee.com/history-api-in-html5/
Pjax的操作流程:
百度:PJAX
ajax取内容
history api改变状态
简称pjax