关于pjax

前言

七歪八拐的看到一个新的名词-pjax，以下是一些探索。

正文

pjax是对ajax + pushState的封装，让你可以很方便的使用pushState技术。

具体的表现：

github网站，结构相同的页面点击，Ajax请求实现，URL改变，页面不刷新。HTML 5中引入的新API: history.pushState和history.replaceState.

Pjax的操作流程:

• 用ajax加载新内容。
• 用history.pushState将原来的页面加入历史记录。
• 加载完成新页面后，用history.replaceState方法修改当前的url。
• 使用document.title修改当前页的标题。

注意: 对使用了pushState的ajax发送特殊的请求头: setRequestHeader('PJAX', 'true')

限制:

• URL必须是相同域的，不能跨域
• state对象不能存放DOM对象
• 仅限HTML 5

另一篇描述PJAX的文章，介绍涉及的相关技术:

• jQuery HTML5 Ajax
• jQuery委托所有的超链接的click事件, live方法: this.live('click',function(event){/* some code */ })
• HTML 5的History API的 pushState方法
• Ajax

两个新方法的定义和介绍:

• history.pushState(data, title [, url]) Pushes the given data onto the session history stack with the specified title and, if provided, URL. The data is treated as opaque by the DOM; you may specify any JavaScript object that can be serialized into JSON format.
• history.replaceState(data, title [, url]) Updates the most recent entry on the history stack to have the specified data, title, and, if provided, URL. The data is treated as opaque by the DOM; you may specify any JavaScript object that can be serialized into JSON format.

我对我自己的办事的效率表示严重的不满，不就是要在网站中添加一个类似Pjax的东西吗，怎么就那么的扯淡呢？ 东看看西看看的，一会去看HTML 5, 一会儿又去看百度百科中的介绍，想到自己关于OAuth2.0方面的还每个结果，要用Grape写API的也是在纸上谈兵，有没有主意啊，行不行啊？所以说，

Talk is cheap , show me code.

下面开始，实战了，不管怎么样，先收集资料:

• pjax_rails : pjax for rails, https://github.com/rails/pjax_rails
• jquery_pjax : https://github.com/defunkt/jquery-pjax

后记

由于仅限HTML 5, 公司的项目看来是指望不上使用pjax了。留个纪念，以后有机会可以实践一下。