基于jQuery中ajax的相关方法汇总(必看篇)

2020-05-24 21:38:50易采站长站整理

前提条件

话说是jquery中的ajax方法,那么前提条件当然是引入jquery啦。


<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

具体方法

①load()

使用

load()
方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:

load(url,[data],[callback])

参数url为加载服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数。

例如,点击“加载”按钮时,向服务器请求加载一个指定页面的内容,加载成功后,将数据内容显示在<div>元素中,并将加载按钮变为不可用。如下图所示:

②使用getJSON()方法异步加载JSON格式数据

使用

getJSON()
方法可以通过Ajax异步请求的方式,获取服务器中的数组,并对获取的数据进行解析,显示在页面中,它的调用格式为:

jQuery.getJSON(url,[data],[callback])
$.getJSON(url,[data],[callback])

其中,url参数为请求加载json格式文件的服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数。

例如,点击页面中的“加载”按钮,调用

getJSON()
方法获取服务器中JSON格式文件中的数据,并遍历数据,将指定的字段名内容显示在页面中。如下图所示:

③使用getScript()方法异步加载并执行js文件

使用

getScript()
方法异步请求并执行服务器中的JavaScript格式的文件,它的调用格式如下所示:

jQuery.getScript(url,[callback])
$.getScript(url,[callback])

参数url为服务器请求地址,可选项callback参数为请求成功后执行的回调函数。

例如,点击“加载”按钮,调用

getScript()
加载并执行服务器中指定名称的JavaScript格式的文件,并在页面中显示加载后的数据内容,如下图所示:

在浏览器中显示的效果: