jQuery 封装 ajax 的使用方法

在 jQuery中 给我们封装了 ajax请求
不用考虑 兼容,跨域等问题, jQuery全都给我们解决了
只需要在设定请求时,设定不同的参数,就可以完成不同的请求

一、jQuery中 封装的 ajax请求 有3种

1. $.get() get请求方式
参数有4个参数,必填参数是 url地址 其他参数都是选填参数,可以没有
参数的形式是对象形式
$.get({
url : 地址(必填)
data : 携带的参数 对象形式
dataType : 期望的数据类型,如果为json,会将后端返回的json串,自动解析
success : function(){} 请求成功时执行的函数
})

2. $.post() post请求方式
参数有4个参数,必填参数是 url地址 其他参数都是选填参数,可以没有
参数的形式是对象形式
$.post({
url : 地址(必填)
data : 携带的参数 对象形式
dataType : 期望的数据类型,如果为json,会将后端返回的json串,自动解析
success : function(){} 请求成功时执行的函数
})

3. $.ajax() 综合方式
参数有 N 个参数,特别特别多,逐一介绍
常规get,post请求(不是跨域),常用参数
$.ajax({
常用:
url : 地址;
type / method : 请求方式 默认值是get方式
data : { } 传参参数,必须是对象形式
dataType : json, 设定为json,会自动解析反应提中的json串
success : function(){} 请求成功执行的函数
不常用:
async : 设定是否异步,默认值是true,异步执行ajax请求
error : function(){} 请求错误时执行的函数
请求成功时不会执行
timeout : 设定时间,单位 毫秒
如果请求时间超过设定的时间,认为是请求失败
必须是异步执行
cache : 设定是否缓存请求结果
默认值是 true,缓存请求结果
必须是get方式,这个设定才起作用
post方式不会缓存,设定也没有效果
context : 指定 执行函数中 this的指向
})
问题: 注意语法
之前是 $().方法() 是标签对象的方法
现在是 $.方法() 是jQuery自己本身的方法

二、使用 jQuery 封装的 ajax 请求 完成跨域

    1, 代理方式
        必须是高版本的jQuery
        设定好 服务器代理
        定义好请求方式
        get方式参数设定在url地址中
        post方式参数设定在 data中

    2, jsonp方式
        支持 jsonp方式,完成跨域请求

        回顾:
            先定义一个函数
            在PHP中 输出字符串,字符串内容是调用函数,并且定义参数  echo  '函数名称(数据参数)'
            在js当中,就等于是 执行这个函数


        封装的ajax

            url : 地址是一个跨域地址
            dataType : 必须是 jsonp
            jsonp : 设定函数名称,默认是callback

        php中: 
            echo 的内容是字符串拼接形式
            echo "$函数名称变量(" . json_encode($返回数据) . ")";
            函数名称 存储在变量中,使用 " " 双引号解析
            返回的数据,必须是 json串格式 , 使用 json_encode() 转化,拼接在 函数的参数位置中

        实际项目中,跨域请求的往往是 其他服务器提供的数据接口

        接口 : 是服务器提供的,外部访问数据的一个窗口
               外部请求,使用指定的方法,可以通过接口来获取服务器中的相关的数据
               通过发送不同的函数名称,后端程序调用不同的函数,传参不同参数,前端获取不同的数据

        端口 : 是计算机内部的硬件设定
               运行在计算机中的软件程序,必须通过不同的端口,来调用计算机的硬件设置
               如果一个软件定义一个端口,之后其他的软件,再定义这个端口,就会执行失败,无法运行程序
               所谓端口,就是软件程序,执行的通道,执行的位置
  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值