[知了堂学习笔记]_Ajax入门

最新推荐文章于 2018-02-02 11:19:26 发布

「已注销」

最新推荐文章于 2018-02-02 11:19:26 发布

阅读量213

点赞数

分类专栏：基础学习文章标签： ajax

本文链接：https://blog.csdn.net/J_YTL/article/details/78757229

版权

基础学习专栏收录该内容

31 篇文章 0 订阅

订阅专栏

1.异步交互

a.浏览器发送请求到服务器端
b.服务器端通过与后台业务框架进行数据处理
c.服务器端处理好的数据转换成XML、Json、Text，同时将数据发送给客户端
d.客户端通过XMLHttpReuquest核心对象对数据进行解析处理
e.最后再将解析好数据通过HTML、CSS等技术进行装饰
这里写图片描述

2.XMLHttpRequest创建

var xmlHttpReq = false;

//初始化XmlHttpRequest
function createXmlHttpRequest(){
    if(window.XMLHttpRequest){
        xmlHttpReq = new XMLHttpRequest();//在非IE5
    }else if(window.ActiveXObject){//在IE5、IE6
        try{
            xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
        }catch(e){
            console.log("=====boom=====");
        }
    }
}

3.发送Ajax请求

function sendRequest(url,params){
    createXmlHttpRequest();
    xmlHttpReq.open("POST", url, true);
    xmlHttpReq.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlHttpReq.send(params);
    xmlHttpReq.onreadystatechange = function() {
        if(xmlHttpReq.readyState == 4 && xmlHttpReq.status == 200){
            //数据解析
        }
    }
}