第十二章：第44节JavaScript页面无刷新交互——ajax无刷新分页效果、ajax数据交换格式
更新于：2017-11-30 18:51:55
ajax用途非常广泛，像二级联动需求不算多，最多的是用于无刷新分页。
http://网址/data.php?page=1
http://网址/data.php?page=2
http://网址/data.php?page=3
.....
传统分页效果，获得每页信息的时候全部页面都需要刷新。
无刷新分页的必要性
如果我们通过“传统方式”实现上图的商品评论分页效果，每次分页的时候就会使得头部、左侧、底部等已经显示的信息重新从服务器获得出来，这样对带宽、服务器资源、用户等待时间都有额外的损耗。如果使用ajax无刷新分页，每次就只从服务器获得“商品评论区域”信息即可，对各方面资源的使用就有相应节省。因此ajax无刷新分页效果有其存在必要性。
还有像百度贴吧、腾讯新闻评论区的内容都有类似点击显示全部的功能，显示的内容都是靠ajax获取的。他们这样做也是出于界面、宽带的考虑。
下面楠神带着大家实现ajax无刷新分页效果：
第十一章的示例，显示会员列表
把分页功能有原来的get方式改成ajax的get方式。
1）改造下扩展类Page.class.php，让其实现下面的效果：
这样点击一个超链接，不再是页面跳转，而是执行一个JS函数。
2）在User类中加一ajax请求方法
3）在视图文件listShow.html中的JS代码
这样就可以实现无刷新分页效果了。
大家一定要做下这个功能，类似应用很多。
额外说明下：
大公司楠神不太清楚，有些普通的小公司，虽然也有做前端的开发人员，像这种功能页面的JS代码到底有谁写呢？这个问题不好说。前端会做好静态页面，而PHP程序员不仅要写后台，还要“套页面”。“套页面”就是把前端开发人员给的静态页面写到项目里，这样免不了会修改HTML、CSS、JS的代码。所以PHPer虽然不专门开发前端页面，HTML、CSS、JS都必须要懂。PHPer主导整个业务逻辑，如果前端开发人员与后端开发人员（PHP）配合不好，ajax的工作都有PHPer在“套页面”时去写。
ajax数据交换格式
大家通过这四节内容学习，有没有注意到，楠神是怎样把PHP处理的数据告诉了JS？是不是都是以字符串的形式？前面就说过了：在很多方面，数据主要靠字符串的形式传输的。
在ajax中，楠神用了两种形式的字符串表示数据，一种就是HTML文本形式，另一种就是json格式。这两种在ajax中是比较常用的数据形式。
HTML文本形式：使用这种形式，多数是数据不需要JS再做处理了，直接使用。
json格式：传输数据小，节省宽带。可以转成JS对象，JS更容易对数据操作。
现在是不是对json有了更进一步了解，它在编程中应用很广泛的。json不仅可以用来存储数据，比如把PHP数组存入数据库，而且在传输数据中优势更明显（所占字节小，编程语言操作起来灵活）。
额外拓展：
其实除了json这种数据交换格式，还有一种常见的数据交换格式——XML。
它和HTML一样是标记语言，它的标记元素是用户自定义的。前面楠神很少讲涉及它的知识，主要是我觉着平时用到的太少了。
xml可以做数据交换格式，但json对比xml的生成和处理要更加方便。因此在许多领域，json正逐步取代xml的使用。
xml可以做配置文件，在PHP中却很少用到xml做配置文件。
PHP、JS都可以对xml做操作，如果以后涉及到xml的应用，都是很好学习的。