原生ajax封装

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Untitled Page</title>
    <script type="text/javascript" src="jquery-3.2.1.js"></script>
    <script type="text/javascript">


        function ajax(parm){

            //创建ajax对象
            var xhr = null;

            if (window.XMLHttpRequest) {
                xhr = new XMLHttpRequest();
            }
            else if (window.ActiveXObject) {
                xhr = ActiveXObject('Microsoft.XMLHTTP')
            }
            //回调函数
            xhr.onreadystatechange=function(){
                if(xhr.readyState==4){
                    if(xhr.status==200){
                        var result = xhr.responseText;//只考虑json格式
//                        var use = JSON.parse(result);
                        if (parm.success='function'){
                            parm.success(result)
                        };
                    }else{
                        parm.erro()
                    };
                }
            }
            if(parm.type=='get'){
                var URL=parm.url +"?"+'key=value';
            }
            else if (parm.type=='post'){
                xhr.setRequestHeader("Content-Type","application/x-www/form-urlencode");
            };
            xhr.open(type,URL,true);
            xhr.send(null);
        };

      $(function(){
          $("#btn").click(function(){
              var parm1 = {
                  type:'get/post',
                  dataType:"xml/json",
                  url:'01data.php',//如果type=get则URL='URL?code='+value;data设置为null
                  data:{key:value},
                  success:function(use){
                      alert(use)
                  },
                  erro:function(){}
              };
              ajax(parm1);
          })


      })

    </script>
</head>
<body>
<input type="button" id="btn" value="click">
<div id="show"></div>
</body>
</html>
</body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容