什么是 Ajax

Ajax的全称是Asynchronous Javascript And XML(异步 JavaScript和XML)。

通俗的理解:在网页中利用XMLHttpRequest对象和服务器进行数据交互的方式,就是Ajax。

Ajax 的典型应用场景

用户名检测:注册用户时,通过ajax的形式,动态检测用户名是否被占用

 

 

 

搜索提示 : 当输入搜索关键字时, 通过 Ajax 的形式, 动态加载搜索提示列表

 

 

 数据分页显示 : 当点击页码值的时候, 通过 ajax 的形式, 根据页码值动态刷新表格的数据

 

 

 数据的增删改查:数据的添加、删除、修改、查询操作,都需要通过ajax的形式,来实现数据的交互

 

 

 

了解jQuery中的Ajax

浏览器中提供的XMLHttpRequest用法比较复杂,所以jQuery对 XMLHttpRequest进行了封装,提供了一系列 Ajax相关的函数,极大地降低了Ajax的使用难度。

jQuery中发起 Ajax请求最常用的三个方法如下:

$.get()

$.pos()

$.ajax()

$.get()函数的语法

jQuery 中 $.get()函数的功能单一,专门用来发起get请求,从而将服务器上的资源请求到客户端来进行使用。

$.get()函数的语法如下:

 

 其中, 三个参数各自代表的含义如下 : 

 

 

$.get()发起 不带参数 的请求

使用$.get()函数发起不带参数的请求时,直接提供请求的URL地址和请求成功之后的回调函数即可,示例代码如下 :

$.get()发起 不参数 的请求

使用 $.get() 函数发起带参数的请求时, 示例代码如下 :

 

 

$.post() 函数的语法

jQuery 中 $.post()函数的功能单一,专门用来发起post请求,从而向服务器提交数据。

$.post()函数的语法如下:

 

 其中, 三个参数各自代表的含义如下 :

 

 $.post() 向服务器提交数据

使用 $.post() 向服务器提交数据的示例代码如下 :

 

 

$.ajax() 函数的语法

相比于 $.get() 和 $.post() 函数, jQuery 中提供的 $.ajax() 函数, 是一个功能比较综合的函数, 它允许我们对 Ajax 请求请进行更详细的配置.

$.ajax() 函数的基本语法如下 :

 

 使用 $.ajax() 发起 GET 请求

使用 $.ajax() 发起 GET 请求时, 只需要将 type 属性的值设置为 'GET' 即可:

 

 使用 $.ajax() 发起 POST 请求

使用$.ajax()发起POST请求时,只需要将type属性的值设置为 'POST' 即可:

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  

 

posted @ 2022-04-28 14:41  会前端的洋  阅读(171)  评论(0)    收藏  举报