初识前端--jQuery中的Ajax

jQuery中提供了一些封装好的使用Ajax的方法

分类

方法	说明	参数和说明
$.ajax({});	标准的调用Ajax的方法，可以写POST/GET/同步/异步/请求参数/返回值类型等内容	type：请求方式 GET/POST url：请求地址 url async：是否异步，默认是 true 表示异步 data：发送到服务器的数据 dataType：预期服务器返回的数据类型 success：请求成功时调用此函数 error：请求失败时调用此函数
$.get();	GET请求方法，默认使用GET方式提交请求，没有error参数	参数1：请求地址 参数2：传递参数，可以省略不写 参数3：拿到成功返回值的处理方法，可以省略不写
$.post();	POST请求方法，默认使用GET方式提交请求，没有error参数	参数1：请求地址 参数2：传递参数，可以省略不写 参数3：拿到成功返回值的处理方法，可以省略不写
$.getJSON()	请求返回的数据类型是 JSON 格式的 ajax 请求

$.ajax()

• 标准封装的Ajax工具方法，和上文初识前端–Ajax封装中的封装类似，使用方法不多赘述
• dataType：预期服务器返回的数据类型
  • 如果赋值"json"，则返回数据类型为json
• success：请求成功时调用此函数
• error：请求失败时调用此函数

$.get()

• 请求 json 文件，忽略返回值

  $.get('../js/cuisine_area.json');
  

• 请求 json 文件，传递参数，忽略返回值

  $.get('../js/cuisine_area.json',{name:"tom",age:100});
  

• 请求 json 文件,拿到返回值,请求成功后可拿到返回值

  $.get('../js/cuisine_area.json',function(data){
  console.log(data)
  });
  

• 请求 json 文件,传递参数,拿到返回值

  $.get('../js/cuisine_area.json',{name:"tom",age:100},function(data){
  console.log(data)
  });
  

$.post()

• 与# $.get()类似，不多赘述

$.getJSON()

• 请求返回的数据类型是 JSON 格式的 ajax 请求

获取JSON格式返回数据的方法

• 获取到的资源是JSON格式的（资源以.json结尾）
• 获取到资源后，使用js的 JSON.parse()方法强转
• 在$.ajax()方法中，声明dataType:“json”
• 使用$.getJSON()方法

特殊方法

• jsonp：跨域访问