Fork me on GitHub

jQuery-ajax

  jQuery对Ajax采用了三层封装,其中最低层的时$.ajax(),中层封装的时$().load(),$.get(),$.ost(),最顶层getScript()和getJSON()。

一、$().load()方法

  $().load()方法是局部方法,.load()方法中共有三个参数:url(链接地址)、发送的数据data,回调函数callback

  注:第二个参数为非必选参数

  1)参数url,可以提供筛选功能

    $().load('data/test.html')

    $().load('data/test.html .box')  》》》筛选功能

  2)data参数传入决定,是否以post方式提交参数是一个对象形式传入

    $().load('data/test.html',{data:'admin'})

  3)回调函数function(response,status,xhr){}

    $().load('data/test.html',{data:'admin'},function(response,status,xhf){})

    注:response:返回结果,和页面里内容一样。status:状态,success,或者error。xhr:XMLHttpRequest 》》》一个对象

xhr四个常用属性

属性名 说明
responseText 作为相应主题被返回单文本
responseXML 如果响应主题内容类型是"text/html"或"application/xml",则返回包括响应数据的XMLDOM文档
status 响应的HTTP状态码
statusText HTTP状态的说明

二、$.get()和$.post()

  $.get()和$.post()有四个参数=>url(地址参数,必填),参数data,callback函数,type

  注:一般情况下,type都是只能判断,并不需要人为设置,除非需要打印整个的代码,才需要强制类型转化

$.get()和$.post()的差别:$.get()是以get方式提交,$.post()方式是以post方式提交。

  1.get方式提交数据是吧数据放在浏览器网址上面的,post是通过http消息,实体提交的。

  2.get提交方式有大小限制,限制在2KB,而post方式不收大小限制。

  3.get方式因为在浏览器中会被历史记录缓存,所以这种提交数据方式并不安全,post方式没有这种问题。

  4.在服务器端(php语言),get方式通过$GET[]方式获取,post通过$POST[]方式获取。

三、$.ajax()方法

  getScript()和$.getJSON()

  注:有三个参数,与$.get()和$.post()方法,前三个参数相同

  getScript()在需要资源的时候加载,是实现资源节约的时候需要用到的一个方法

$.ajax()方法

  $.ajax({

    url:'链接路径',

    type:'post/get',

    data:{键:值},

    success:function(res){成功时传入的参数}

  }) 

表单序列化
  当页面上表单需要提交时,我们如果把数据直接写在data里面工作量会很大,所以出现了表单序列化。
  $('form').serialize()
  表单序列化是把整个表单内容提取出来,组成一个键值对,并且对URL进行编码。
  $.ajaxSetup()  ajax初始化对于ajax可以做一个预先设置,减少重复。
 
  $.ajaxSetup({
      url:'',
      type:'post',
      data:{user:'ddd'}
  })
  
 
$.ajax({
    success:function(data){
        alert(data)
    }
})
 
$.param()方法,用来解析对象。
 
因为浏览器对对象的解析有限,太过复杂的对象无法解析,于是出现了$.param()方法用来解析对象。
 
alert($.param({
    email:'ddd',
    user:'lll'
}))
全局函数类型 何时被触发 参数
ajaxStart 在jQuery AJAX函数或命令发起时,但在XHR实例被创建之前
类型被设置为ajaxStart的全局回调信息对象
ajaxSend
在XHR实例被创建之后,但在XHR实例被发送给服务器之前
类型被设置为ajaxSend的全局回调信息对象;XHR实例;$.ajax()函数使用的属性
ajaxSuccess
在请求已从服务器返回之后,并且响应包含成功状态码
类型被设置为ajaxSuccess的全局回调信息对象;XHR实例;$.ajax()函数使用的属性
ajaxError
在请求已从服务器返回之后,并且响应包含失败状态码
类型被设置为ajaxError的全局回调信息对象;XHR实例;$.ajax()函数使用的属性;被XHR实例返回的异常对象(如果有的话)
ajaxComplete
在请求已从服务器返回之后,并且在任何已声名的ajaxSuccess或ajaxError回调函数已被调用之后
类型被设置为ajaxComplete的全局回调信息对象;XHR实例;$.ajax()函数使用的属性
ajaxStop
在所有其他AJAX处理完成以及任何其他适用的全局回调函数已被调用之后
类型被设置为ajaxStop的全局回调信息对象

posted on 2019-09-23 11:45  蓝魂殇  阅读(128)  评论(0编辑  收藏  举报

导航