js原生 Ajax

 

1. Ajax简介
• AJAX( Asynchronous JavaScript and XML)异步的 JavaScript 和 XML。在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容，使网页实现异步更新，不需要任何浏览器插件。
2. Ajax原理（语法）
1. XHR创建对象 new一个XMLHttpRequest
2. 定义请求方式
3. 向服务器发送请求（请求参数get 在url中填写、post在send(中书写)）
4. 响应与数据处理

 //1.new一个XMLHttpRequest 兼容性写法
var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    //2.定义请求方式
    xmlhttp.open("GET", "http://yapi.shangyuninfo.com/mock/156/bookType")
    //3.向服务器发送请求
    xmlhttp.send();
    //4.响应与数据处理
    xmlhttp.onreadystatechange = function (res) {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            console.log(res.currentTarget.response);
            var resout = JSON.parse(res.currentTarget.response)
            console.log(resout.book[0].typeList);
        }
    }