我們都知道ajax給瀏覽器帶來(lái)了異步加載的能力，在數(shù)據(jù)校驗(yàn)、局部刷新等方面提升了用戶(hù)體驗(yàn)，但同時(shí)存在如下問(wèn)題：

1. 可以無(wú)刷新改變頁(yè)面內(nèi)容，但無(wú)法改變頁(yè)面URL
2. hash的方式不能很好的處理瀏覽器的前進(jìn)、后退等問(wèn)題

為了解決傳統(tǒng)ajax帶來(lái)的問(wèn)題，HTML5里加強(qiáng)了history API，加入了pushState、replaceState接口和popstate事件。這里就不詳細(xì)介紹了，沒(méi)有這方面知識(shí)的同學(xué)建議先看一下相關(guān)的資料。

pjax插件封裝了pushState和ajax操作,為我們提供了一個(gè)開(kāi)發(fā)這這類(lèi)web應(yīng)用的簡(jiǎn)單方法，具體步驟如下：

定義需要局部更新的容器

<div id="container"></div>
初始化pjax，監(jiān)聽(tīng)URL

后端處理pjax請(qǐng)求

后端的處理邏輯是，首先判斷是不是pjax請(qǐng)求，如果是的話(huà)，根據(jù)請(qǐng)求參數(shù)返回局部?jī)?nèi)容，否則返回layout布局，然后由`$.pjax.reload('#container');`發(fā)起pjax請(qǐng)求。根據(jù)以上邏輯可以寫(xiě)出如下代碼：

完整代碼：pjax-demo

這只是pjax最基礎(chǔ)的功能，pjax提供了豐富的api，請(qǐng)?jiān)L問(wèn)：jquery-pjax