Ajax

什么是Ajax

Ajax是Asynchronous JavaScript and XML的简称，译为异步的JavaScript和XML。
在以前，每当浏览器发送一个请求，服务器会做出响应，返回一个完整的新页面。如果网络太慢或者其他原因，就会得到一个404的页面，用户体验太差。
Ajax是一种请求数据的方法，它会采用异步的方式发送请求和处理响应，局部更新页面需要被改变的地方，不会刷新整个页面，使用户可以继续在当前页面工作浏览而不必等待响应。
优缺点：
1.用户可以向服务器请求多项内容而不必等待响应，可以继续浏览页面；
2.浏览器请求返回的速度更快；
3.页面只有需要被改变的地方得到更新，而不必刷新整个页面；
4.由于Ajax暴露了和服务器的通讯方式，容易受到攻击。

前后端开发联调需要注意哪些事情？后端接口完成前如何 mock 数据？

前后端联调：
1.约定传输的数据，数据格式，类型；
2.约定接口，请求格式、响应格式等；
3.根据各种约定、编写约定文档。
如何mokc数据
根据约定，使用server-mock来模拟数据。还有很多不同的mock工具，目的都是为了搭建一个虚拟服务器，对数据进行mock。

点击按钮，使用 ajax 获取数据，如何在数据到来之前防止重复点击?

1.数据到达且渲染到页面前，disabled掉按钮，让用户无法重复点击；

var btn = document.querySelector("#btn");
btn.addEventListener("click",function() {
    btn.disabled = true;
    var request = new XMLHttpRequest();
    request.onreadystatechange = function() {
        //do something
        btn.disabled = false;
    }
    request.open();
    request.send();
})

2.使用一个状态锁，如果状态锁为true，则发送请求，否则忽略用户点击

var lock = true;
var btn = document.querySelector("#btn")
btn.addEventListener("click",function() {
    if(!lock) {
        return;
    }
    var request = new XMLHttpRequest()
    request.onreadystatechange = function() {
        //do something
        lock = true;
    }
    request.open()
    request.send()
    lock = false;
})

实现加载更多的功能

js中为后端部分
http://js.jirengu.com/licaceqotu/1/edit