理解jQuery AJAX-优快云博客

AJAX 是与服务器交换数据的艺术，在不重载全部页面的情况下，实现了对部分网页的更新。

ajax() 方法通过 HTTP 请求加载远程数据。

该方法是 jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数，除非你需要操作不常用的选项，以获得更多的灵活性。

最简单的情况下，$.ajax() 可以不带任何参数直接使用。

注意：所有的选项都可以通过 $.ajaxSetup() 函数来全局设置。

1.url--string类型，ajax请求的的地址
2.data--可选参数，object类型，发送至服务器的键值数据会作为jQuerystring附加到URL中
发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组，jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
3.callback--可选参数，function类型，当ajax返回成功时自动调用该函数
4.type--请求类型，可以使HTML，xml,json等。默认值: "GET")。请求方式 ("POST" 或 "GET")， 默认为 "GET"。注意：其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。
5.dataType  String类型，预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如 XML MIME 类型就被识别为 XML。在 1.4 中，JSON 就会生成一个 JavaScript 对象，而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后，传递给回调函数。可用值:
"xml": 返回 XML 文档，可用 jQuery 处理。
"html": 返回纯文本 HTML 信息；包含的 script 标签会在插入 dom 时执行。
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意：在远程请求时(不在同一个域下)，所有 POST 请求都将转为 GET 请求。（因为将使用 DOM 的 script标签来加载）
"json": 返回 JSON 数据 。
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
"text": 返回纯文本字符串
6.error 类型：Function
默认值: 自动判断 (xml 或 html)。请求失败时调用此函数。
有以下三个参数：XMLHttpRequest 对象、错误信息、（可选）捕获的异常对象。
如果发生了错误，错误信息（第二个参数）除了得到 null 之外，还可能是 "timeout", "error", "notmodified" 和 "parsererror"。这是一个 Ajax 事件。
7.jsonp  类型：String在一个 jsonp 请求中重写回调函数的名字。这个值用来替代在 "callback=?" 这种 GET 或 POST 请求中 URL 参数里的 "callback" 部分，比如 {jsonp:'onJsonPLoad'} 会导致将 "onJsonPLoad=?" 传给服务器。
8.jsonpCallback  类型：String  为 jsonp 请求指定一个回调函数名。这个值将用来取代 jQuery 自动生成的随机函数名。这主要用来让 jQuery 生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存 GET 请求的时候，指定这个回调函数名。
9.success  类型：Function  请求成功后的回调函数。
参数：由服务器返回，并根据 dataType 参数进行处理后的数据；描述状态的字符串。这是一个 Ajax 事件。
10..options--ajax调用的具体参数，object类型
例子：$.ajax({
    methods:"get",//jsonp的请求方式都是get
    url:"https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?cb=getdata&wd="+value,
  /*  cb  对应的是跨域里面的回调函数
    wd  指的是用户输入的值
    https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?cb=getdata&wd=*/
    dataType:"jsonp",
    jsonpCallback:"getdata",
    success:function(data){
       console.log(data);
    }
})

$.ajax（{url,options}）;

 $.ajax({
            url:"./data/data.txt",
            dataType:"json",
            type:"post",
            success:function(data){
                //成功后回调
                alert("成功！");
                console.log(data)
            },
            error:function(data){
                //失败回调
                alert("服务器请求失败")
            },
            beforeSend:function(){
                //发送请求前调用
                alert("正在加载")
            }

        })

$.post(url,[data],[callback],[type]);

    $.post({
                method:"",
                data:"",//往服务发送数据  会去写data
                url:"./data/data.txt",//连接的地址  api  php  java  asp
               /* dataType:"json",//返回json数据*/
                success:function (data){
                    //请求数据成功之后返回的函数
                    //操作数据进行动态绑定
                    console.log(data);//json数组
                    console.log(JSON.parse(data));//从json字符串中解析出js对象，并返回
                   /* json数据--一个名称对应一个值
                    "name":"zhangsan"*/
                   /* json对象--保存在大括号里面
                     {"name":"zhnagsan","age":"23"}*/
                  /*  json数组--保存在中括号里面,对象"sites"是一个数组，包含了两个对象
                    "sites":[
                        {"name":"zhangsan"},
                        {"name":"lisi"}
                    ]*/
                },
                error:function (error){

                },
                //默认异步  true  同步false
                async:true
            });

$.get(url,[data],[callback]);

  $.get("./data/data.txt",
                {name:"zhangsan",age:"23"},
                function(data,state){
                    console.log(data);//显示服务器返回的数据
                    if(state=='ok'){//显示返回的状态
                        alert("返回数据成功")
                    }else{
                        alert("返回数据失败")
                    }
                })

$.getJSON(url,[data],[callback]) 数据最终还是通过URL后面通过get方式发送的

$.getJSON({
                method:"post",
                data:"",//往服务发送数据  会去写data
                url:"",//连接的地址  api  php  java  asp
                dataType:"json",
                success:function (data){
                    //请求数据成功之后返回的函数
                    //操作数据进行动态绑定
                },
                error:function (error){

                },
                //默认异步  true  同步false
                async:true
            });

附百度api小例子http://localhost:63342/07.21/%E7%99%BE%E5%BA%A6api.html