做前端开发的朋友一定对ajax异步更新印象深刻。本文主要介绍了ajax异步请求的一些内容，具有一定的参考价值。让我们和边肖一起来看看吧。
做前端开发的朋友一定对ajax异步更新印象深刻。作为一个入坑新人，今天和大家聊聊ajax异步请求。既然是ajax，jQuery的知识是必不可少的。建议你去www.w3school.com学习。教程很完善，适合新手快速入门。
jQuery的引用可以通过下载js文件导入，也可以外部导入。
script src=' http://libs . Baidu . com/jquery/1 . 9 . 0/jquery . js ' type=' text/JavaScript '/script
导入jQuery后，我们就可以开始ajax异步更新请求数据了。
1.使用load()方法请求通过Ajax加载服务器中的数据，并将返回的数据放入指定的元素中。它的调用格式是：load(url，[data]，[callback])参数url是加载服务器的地址，可选的data参数是请求时发送的数据，callback参数是数据请求成功后执行的回调函数。
$(function(){
$('#btn ')。单击(函数(){
$('ul ')。html(' img src=' Images/loading . gif ' alt=' '/')。load('www.manyiaby.com '，function(){
});
});
});
2.使用getJSON()方法，可以通过Ajax异步请求获取服务器中的数据，解析获取的数据并显示在页面上。它的调用格式是jquery.getjson (URL，[data]，[callback])或者$。getjson (URL，[data]，[callback])其中，URL参数是请求加载json格式文件的服务器的地址，可选data参数是请求时发送的数据，callback参数是数据请求成功后执行的回调函数。
$(function(){
$('#btn ')。单击(函数(){
$.getJson('www.manyiaby.com '，function(data){
$.每个(数据，功能(索引，运动){
if(index==3)
alert(sport[' name '])；
})
});
});
});
3.使用getScript()方法在服务器中异步请求和执行JavaScript格式文件。它的调用格式如下：jQuery.getScript (url，[callback])或$。getScript(url，[callback])参数url是服务器请求地址，可选的callback参数是请求成功后执行的回调函数。
$(function(){
$('#btn ')。单击(函数(){
$.getScript('www.manyiaby.com '，function(){
警报(“操作完成”)；
});
});
});
4.使用get()方法时，GET从服务器请求数据，请求的数据由方法中回调函数的参数返回。其调用格式如下：$。get(url，[callback])参数url是服务器的请求地址，可选的callback参数是请求成功后执行的回调函数。
$(function(){
$('#btn ')。单击(函数(){
$.get('www.manyiaby.com '，函数(数据){
alert(data . name)；
}、' JSON ')；
});
});
5.与get()方法相比，post()方法多用于通过POST向服务器发送数据。服务器收到数据后，会对其进行处理，并将处理结果返回给页面。调用格式如下：$。post(url，[数据]，[回调])参数url是服务器的请求地址，可选数据是请求服务器时发送的数据，可选回调参数是请求成功后执行的回调。
$(function(){
$('#btn ')。单击(函数(){
$.post ('www.manyiaby.com '，{name:' Manyi.com '，URL:' www.manyiaby.com'}，function (data) {
警报(数据)；
});
});
});
6.使用serialize()方法，可以用表单中的name属性序列化元素值，并生成标准的URL编码的文本字符串，该字符串可以直接用于ajax请求。它的调用格式如下：$(选择器)。serialize()，其中选择器参数是一个或多个表单中的元素或表单元素本身。
$(function(){
$('#btn ')。单击(函数(){
alert($('form ')。serialize())；
});
});
7.使用ajax()方法是请求服务器数据的最低级也是最强大的方法。它不仅可以获取服务器返回的数据，还可以向服务器发送请求并传递数值。其调用格式如下：jQuery.ajax([settings])或$。ajax([settings])其中参数设置是发送ajax请求时的配置对象，在这个对象中，url代表服务器请求的路径，data是请求过程中传递的数据，dataType是服务器返回的数据类型，success是请求成功执行的回调函数，Type是发送数据请求的方式。默认值是get。
$(function(){
$('#btn ')。单击(函数(){
$.ajax({
网址：' www . many aby . com '，
数据类型：“文本”，
数据：{name:' Manyi.com '，url:'wwww.manyiaby.com'}，
成功：函数(数据){
警报(数据)；
}
});
});
});
8.可以使用ajaxSetup()方法设置Ajax请求的一些全局选项值。设置之后，下面的Ajax请求将不需要添加这些选项值。它的调用格式是jQuery.ajaxSetup([options])或$。Ajax setup([选项])。option参数是一个对象，通过它可以设置Ajax请求的全局选项值。
$(function () {
$.ajaxSetup({
数据类型：“文本”，
成功：函数(数据){
警报(数据)；
}
});
$('#btn ')。bind('click '，function () {
$.ajax({
数据：{name:' Manyi.com '，url: 'www.manyiaby.com'}，
网址：“www . many aby . com”
});
})
});
});
9.ajaxStart()和ajaxStop()方法绑定Ajax事件。ajaxStart()方法用于在Ajax请求发出前触发函数，ajaxStop()方法用于在Ajax请求完成后触发函数。它们的调用格式是：$(选择器)。ajaxStart(function())和$(选择器)。ajaxStop(function())，其中两个方法中的括号都是绑定函数。AjaxStart()方法绑定的函数在发送AJAX请求前执行，ajaxStop()方法绑定的函数在请求成功后执行。
$(function () {
$.ajaxStart(function (){
警报('请求数据.');
});
$.ajaxStop(function (){
警报(“数据请求已完成！”);
});
$('#btn ')。bind('click '，function () {
$.ajax({
网址：' www . many aby . com '，
数据类型：' json '，
成功：函数(数据){
Alert ('name:' data.name ')。
}
});
})
});
10.定义一个json对象，用来保存学生的相关资料。通过美元。each()工具函数，获取数组中每个元素的名称和内容并显示在页面上。
！文档类型html
超文本标记语言
头
meta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /
script src=' http://libs . Baidu . com/jquery/1 . 9 . 0/jquery . js ' type=' text/JavaScript '/script
练习/标题
/头
身体
按钮/按钮
脚本类型='文本/javascript '
$(function () {
$('button ')。bind('click '，function () {
Var jsonDate=[{name:' Manyi.com '，URL:' www . manyi aby . com ' }]；
$.each(jsonDate，function(index，data){
alert(data . name)；
});
})
});
/脚本
/body
/html
这就是本文的全部内容。希望这篇文章的内容能给你的学习或者工作带来一些帮助，同时也希望你能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。