jQuery中的ajax

深碍√TFBOYSˉ_ 2023-06-07 03:07 124阅读 0赞

### jQuery中的ajax ###

1.  `get`  
    参数：![在这里插入图片描述][20191012115325513.png]  
    格式要用`””`

$.get("./data/stu.json", function (res) { 
             console.log(res);
             }, "json");

1.  `post`，同上

$.post("./data/stu.json", function (res) { 
             console.log(res);
             }, "json");

1.  `ajax`中的参数（cros 跨域或者不跨域可以使用）

<table> 
 <thead> 
  <tr> 
   <th>名称</th> 
   <th>含义</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>method</td> 
   <td>请求方法</td> 
  </tr> 
  <tr> 
   <td>url</td> 
   <td>路径</td> 
  </tr> 
  <tr> 
   <td>data</td> 
   <td>传送数据key/value</td> 
  </tr> 
  <tr> 
   <td>success：function{}</td> 
   <td>成功的返回值</td> 
  </tr> 
  <tr> 
   <td>error:function{}</td> 
   <td>错误的返回值</td> 
  </tr> 
 </tbody> 
</table>

其中如果数据类型不是`json`类型，输出为字符串，可以在成功回调函数输出时转换：`json.parse`，也可以在增加一个`dataType:”json”`，也可以转换

1.  `jsonp`跨域请求（`get/post`）  
    以百度接口为例（get传值和post传值的区别）

$.ajax({ 
             method:"post",
             url:"https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su",
             data:{ wd:1,cb:"getData"},
             dataType:"jsonp",
             jsonpCallback:"getData",
             success:function (res){ 
             //res 成功返回值
             //console.log(JSON.parse(res));
             console.log(res);
             },
             error:function (res){ 
             //res 失败返回值
             }
             });

1.  `jquery`中的同步异步：虽然同步时仍然会报提示信息，但是结果仍然输出；在原生js中，谷歌只报错，火狐报错并输出
2.  `getjson`:和`get`方法参数类似，没有最后一个`type`参数，会直接将**任何数据类型**转换为json后输出
3.  `getScript`:动态加载`script`，标签中的`script`的`/`需要转义，否则报错

$.getScript("./js/Slider.js", function (res) { 
                console.log(res);
                /*var str = document.createElement("script") $(str).html(res).appendTo($("body"));*/
                $("<script><\/script>").html(res).appendTo($("body"));
                $("<div><\/div>").appendTo($("body"));
            });

[20191012115325513.png]: /images/20230601/63d56f1457d34ea4928ad4ba12197551.png