思路：
ajax分页：
1、服务器server.js,写布局;2、写接口文档(不管客户端，只写服务器端接口)3、写客户端，绑定数据，分页，优化点击过了，就不再请求；4、给每个li绑定点击事件，跳转详情页面；自定义属性传参5、cookie请求过的直接找缓存；下面直接上代码index.html：
Title 学号 姓名 性别 分数
首页上一页
下一页末页
接下来是样式：css/index.css
@charset "utf-8";* { margin: 0; padding: 0; font-family: "\5FAE\8F6F\96C5\9ED1", Helvetica, sans-serif; -webkit-user-select: none;}ul li { list-style: none;}.table { width: 900px; margin: 20px auto; padding: 10px; border: 1px solid #ccc; box-shadow: 3px 3px 10px 0 pink; overflow: hidden;}.table h2 { height: 40px; line-height: 40px; background: lightblue;}.head span { float: left; width: 25%; height: 100%; text-align: center; font-size: 18px;}.list { height: 300px;}.list li { height: 10%; line-height: 30px;}.list li:nth-child(even){ background: #e1e1e1;}.list li:hover{ background: palegoldenrod;}.list li:active{ background: greenyellow;}.list span { float: left; width: 25%; height: 100%; text-align: center; cursor: pointer;}.page { margin-top: 20px; float: right; overflow: hidden;}.page div { width: 50px;}.page ul { float: left;}.page div, .page li, .page input { margin-left: 5px; height: 18px; line-height: 18px; float: left; border: 1px solid #ccc; text-align: center; font-size: 12px; cursor: pointer;}.page ul li { float: left; width: 20px;}.page ul li.bg{ background: cornflowerblue;}
json文件夹里面包含一个创建data.json数据的js和data.json:
create.js：
/** * Created by Administrator on 2016/5/17. */var nameAry = ["赵一", "钱二", "孙三", "李四", "周五", "吴六", "郑七", "王八", "冯九", "陈十", "楚一", "魏二", "蒋三", "沈四", "韩五", "杨六"];function getRandom(n, m) { return Math.round(Math.random() * (m - n) + n);}var ary = [];for (var i = 1; i <= 78; i++) { var obj = {}; obj.num = (i >= 1 & i <= 9) ? "00" + i : ((i >= 10 & i <= 99) ? "0" + i : i); obj.name = nameAry[getRandom(0, 15)]; obj.sex = getRandom(0, 1); obj.score = getRandom(50, 100); ary.push(obj);}console.log (JSON.stringify(ary)); data.json:
[ { "num": "001", "name": "楚一", "sex": 1, "score": 79 }, { "num": "002", "name": "王八", "sex": 1, "score": 96 }, { "num": "003", "name": "郑七", "sex": 1, "score": 56 }, { "num": "004", "name": "韩五", "sex": 0, "score": 89 }, { "num": "005", "name": "冯九", "sex": 1, "score": 56 }, { "num": "006", "name": "周五", "sex": 1, "score": 65 }, { "num": "007", "name": "陈十", "sex": 1, "score": 74 }, { "num": "008", "name": "郑七", "sex": 1, "score": 73 }, { "num": "009", "name": "吴六", "sex": 0, "score": 94 }, { "num": "010", "name": "吴六", "sex": 0, "score": 61 }, { "num": "011", "name": "王八", "sex": 1, "score": 77 }, { "num": "012", "name": "沈四", "sex": 0, "score": 50 }, { "num": "013", "name": "周五", "sex": 0, "score": 78 }, { "num": "014", "name": "吴六", "sex": 0, "score": 84 }, { "num": "015", "name": "吴六", "sex": 0, "score": 70 }, { "num": "016", "name": "韩五", "sex": 0, "score": 60 }, { "num": "017", "name": "吴六", "sex": 0, "score": 90 }, { "num": "018", "name": "冯九", "sex": 1, "score": 74 }, { "num": "019", "name": "周五", "sex": 0, "score": 62 }, { "num": "020", "name": "郑七", "sex": 0, "score": 67 }, { "num": "021", "name": "沈四", "sex": 1, "score": 74 }, { "num": "022", "name": "赵一", "sex": 0, "score": 58 }, { "num": "023", "name": "冯九", "sex": 0, "score": 55 }, { "num": "024", "name": "魏二", "sex": 1, "score": 87 }, { "num": "025", "name": "陈十", "sex": 1, "score": 73 }, { "num": "026", "name": "李四", "sex": 0, "score": 59 }, { "num": "027", "name": "王八", "sex": 1, "score": 54 }, { "num": "028", "name": "魏二", "sex": 0, "score": 59 }, { "num": "029", "name": "郑七", "sex": 0, "score": 84 }, { "num": "030", "name": "魏二", "sex": 0, "score": 80 }, { "num": "031", "name": "韩五", "sex": 0, "score": 73 }, { "num": "032", "name": "王八", "sex": 0, "score": 67 }, { "num": "033", "name": "魏二", "sex": 1, "score": 76 }, { "num": "034", "name": "吴六", "sex": 0, "score": 80 }, { "num": "035", "name": "王八", "sex": 0, "score": 100 }, { "num": "036", "name": "吴六", "sex": 1, "score": 65 }, { "num": "037", "name": "韩五", "sex": 1, "score": 53 }, { "num": "038", "name": "陈十", "sex": 0, "score": 93 }, { "num": "039", "name": "魏二", "sex": 1, "score": 56 }, { "num": "040", "name": "王八", "sex": 0, "score": 92 }, { "num": "041", "name": "沈四", "sex": 1, "score": 69 }, { "num": "042", "name": "沈四", "sex": 0, "score": 83 }, { "num": "043", "name": "吴六", "sex": 1, "score": 95 }, { "num": "044", "name": "楚一", "sex": 0, "score": 97 }, { "num": "045", "name": "郑七", "sex": 0, "score": 97 }, { "num": "046", "name": "王八", "sex": 1, "score": 51 }, { "num": "047", "name": "王八", "sex": 0, "score": 82 }, { "num": "048", "name": "冯九", "sex": 1, "score": 78 }, { "num": "049", "name": "郑七", "sex": 1, "score": 81 }, { "num": "050", "name": "孙三", "sex": 1, "score": 53 }, { "num": "051", "name": "孙三", "sex": 1, "score": 87 }, { "num": "052", "name": "沈四", "sex": 1, "score": 65 }, { "num": "053", "name": "魏二", "sex": 0, "score": 99 }, { "num": "054", "name": "冯九", "sex": 0, "score": 98 }, { "num": "055", "name": "周五", "sex": 1, "score": 58 }, { "num": "056", "name": "钱二", "sex": 0, "score": 76 }, { "num": "057", "name": "陈十", "sex": 0, "score": 57 }, { "num": "058", "name": "魏二", "sex": 1, "score": 100 }, { "num": "059", "name": "杨六", "sex": 0, "score": 96 }, { "num": "060", "name": "周五", "sex": 1, "score": 67 }, { "num": "061", "name": "蒋三", "sex": 0, "score": 74 }, { "num": "062", "name": "赵一", "sex": 1, "score": 59 }, { "num": "063", "name": "杨六", "sex": 1, "score": 72 }, { "num": "064", "name": "陈十", "sex": 1, "score": 87 }, { "num": "065", "name": "楚一", "sex": 0, "score": 77 }, { "num": "066", "name": "蒋三", "sex": 0, "score": 91 }, { "num": "067", "name": "杨六", "sex": 0, "score": 81 }, { "num": "068", "name": "冯九", "sex": 1, "score": 91 }, { "num": "069", "name": "吴六", "sex": 0, "score": 98 }, { "num": "070", "name": "杨六", "sex": 1, "score": 65 }, { "num": "071", "name": "王八", "sex": 1, "score": 76 }, { "num": "072", "name": "周五", "sex": 1, "score": 69 }, { "num": "073", "name": "魏二", "sex": 1, "score": 98 }, { "num": "074", "name": "韩五", "sex": 1, "score": 58 }, { "num": "075", "name": "钱二", "sex": 0, "score": 62 }, { "num": "076", "name": "钱二", "sex": 0, "score": 87 }, { "num": "077", "name": "赵一", "sex": 0, "score": 58 }, { "num": "078", "name": "冯九", "sex": 1, "score": 64 }] 最后这个是server.js服务器：
/** * Created by Administrator on 2016/5/17. */var http = require("http");var url = require("url");var fs = require("fs");var server = http.createServer(function (request, response) { var urlObj = url.parse(request.url, true); var pathname = urlObj.pathname; var query = urlObj.query; var reg = /\.(HTML|CSS|JS)/i; if (reg.test(pathname)) { var suffix = reg.exec(pathname)[1].toUpperCase(); var conType = suffix == 'HTML' ? 'text/html' : (suffix === 'CSS' ? 'text/css' : 'text/javascript'); var fileText = fs.readFileSync('.' + pathname); response.writeHead(200, {'content-type': conType}); response.end(fileText); return; } //写API接口： if (pathname === '/getData') { var Count = query.pageCount; //console.log(pageCount); var page = query.page; var data = fs.readFileSync('./json/data.json', 'utf8'); data = JSON.parse(data); var total = Math.ceil(data.length / query.Count); var ary = []; for (var i = (query.Num - 1) * query.Count; i <= (query.Num * query.Count) - 1; i++) { //console.log(query); var cur = data[i]; if (i > data.length-1) { break; } ary.push(cur); //console.log(cur); } response.writeHead(200, {'content-type': 'application/json; charset=utf8'}); response.end(JSON.stringify({'total': total, 'list': ary})); }});server.listen(8888, function () { console.log('8888端口监听成功');}); 服务器里面的端口号是8888，记得路径是localhost:8888/index.html