黄聪：初识Pjax：pjax是什么

据说博主再也不折腾wordpress了，陌小雨仍是转载到网站作个备份吧，万一哪天没有了呢。陌小雨以为讲的挺清楚的，小白都能懂。

pjax是 pushstate + ajax，分别百度能够获得相关资料，在此就不赘述了。

Ajax

ajax直白的理解就是请求一个连接所指向的页面的其中一部分来替换当前页面的一部分，好比我用的wordpress，典型的博客页面，有页面头部、主体部分、侧栏部分、页面底部四个主要部分。
ajax请求的过程是如何的呢？好比我如今打开的是页面A，页面A中有一个a标签，正常状况下点击a标签的连接会打开一个页面B，那么整个页面A就会被替换成页面B。然而，页面A和页面B有些结构是彻底同样的，好比头部，底部，甚至是侧栏，其实要替换的仅仅是主体部分而已，ajax就提供了这样一个功能，它控制你在点击a标签的连接时，只抓取页面B的主体部分来替换页面A的主体部分，而头部、底部、侧栏不用替换（也就不用刷新）。

PushState

以上是最直白的理解，而pushstate则是干吗的？HTML5里引用了新的API，history.pushState和history.replaceState，就是经过这个接口作到无刷新改变页面URL的。由于用ajax替换局部页面时，浏览器的地址是不会改变的，你替换为页面B的主体，地址栏的url仍是页面A的，并且点击浏览器的后退或前进按钮地址栏url也是不会改变的，pushstate的做用则用来改变地址栏url的状态。

那么PJAX就是以上二者的结合。

开始咱们必须对 被请求的页面进行请求前的处理，这个处理很是重要，若是把被请求的页面想象成一张图片，那么这个处理就至关于对图片进行剪裁，没有处理以前，被请求的页面B是完整的，请求过来就首先要预读取一边页面B，而其实咱们没必要要将整个页面都读取，咱们只须要读取主体部分，因此咱们能够把头部、侧栏和底部都先剪掉，只剩下主体部分，而后再请求过来替换页面A中的主体部分。
这个剪裁的方法以下：

在对应的php页面进行

1. <?php if( $_GET['ajx'] != 'container' ) { >
2.  
3. //被剪裁掉的部分，好比：
4. //<?php get_header(); ?>
5. //<?php get_sidebar(); ?>
6. //<?php get_footer(); ?>
7.  
8. <?php } >

这个方法很是重要，包括评论分页也须要这样的处理，对pjax的速度是一大影响。了解了这个其实剩下的只须要把剩下的代码超过去就能够了。固然，你不剪裁也是能够的，那也能够替换，但那就不算是真正的ajax了。目前大多数pjax的代码都不会有这样的处理。下面一篇是pjax的核心代码以及一些说明。

普及一点关于ajax的知识：

• 什么状况适合作全站Ajax？

你的主题结构比较简单，除了内容框会变化，其余侧栏，顶部，底部都是固定的内容。你的Wordpress不使用不少修饰类插件（考虑到兼容性）、不使用缓存插件。

• 作了全站Ajax有什么好处？

没必要再重复加载固定内容的侧栏、顶部、底部、背景图、各类JS、CSS、加快载入速度。

要骚一点的，在侧栏加个播放音乐的功能，嘿，页面无刷新就不会把音乐刷停了，除非浏览者主动点击中止播放。（这个是不少人折腾ajax的一个出发点呀）

• 我应该折腾ajax么，我须要懂哪些知识？

要折腾起来，你自己仍是得有必定的基础，类C语言的基础，HTML的基础，jQuery选择器，PHP……若是你一点基础都没有，那仍是别折腾了，就像境界还达不到却硬要去练高层次的内功心法，走火入魔毁一辈子啊！

参考文章：http://www.inlojv.com/how-to-use-pjax-1.html

http://darkhandz.com/wordpress_site_in_ajax_1