美文网首页
ajax 的封装

ajax 的封装

作者: flyHunter雄 | 来源:发表于2017-04-25 12:28 被阅读0次

    Ajax 的 简介
    AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
    AJAX = 异步 JavaScript和XML
    AJAX 是一种用于创建快速动态网页的技术。
    通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新
    传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。

    Ajax响应数据类型:
    1、字符串类型:
    使用responeText接受
    2、json格式数据:
    在后台发送的是 json 对象
    3、XML类型数据
    在后台声明发送的是XML数据:
    resp.setContentType("text/xml;charset=utf-8");
    使用responseXML接受
    var doc=req.responseXML;返回的是document对象
    处理:
    var n=doc.getElementsByTagName("name")[角标].innerHTML
    var n=doc.getElementsByTagName("name")[角标].firstChild.data;

    Ajax的基础封装如下代码

    function myAjax(method,url,data,deal200,deal404,deal500,async){
            var req=getRequset();   
            //复写onreayStatechange
                req.onreadystatechange=function(){
                    //处理响应
                    if(req.readyState==4){
                        if(req.status==200){
                            if(deal200){
                                deal200(req);
                            }
                            
                        }else if(req.status==404){
                            if(deal404){
                                deal404();
                            }
                            
                        }else if(req.status==500){
                            if(deal500){
                                deal500();
                            }                           
                        }
                    }
                }   
            //创建请求
            if("get"===method.toLowerCase()){
                //get
                req.open(method,url, async);
                
                //get
                req.send(null); 
            }else if("post"===method.toLowerCase()){
                //post
                req.open(method, url+(data==null?"":"?"+data), async);
                req.setRequestHeade("Content-Type","application/x-www-form-urlencoded");
                //post
                req.send(data);
            }   
        }
    
        function getRequset(){
            //创建ajax引擎对象
            var req;
            if(window.XMLHttpRequest){
                req=new XMLHttpRequest();
            }else if(window.ActiveXObject){
                req=new ActiveXObject("Msxml2.XMLHTTP");
            }
            return req;
        }

    相关文章

      网友评论

          本文标题:ajax 的封装

          本文链接:https://www.haomeiwen.com/subject/osxpzttx.html