这几天,一直在学习关于ajax与json数据的理解。一直不是很理解ajax到底怎么用。
看了很多大神的博客,很多都是运用php与asp来链接ajax。而且看到很多关于ajax中的XHR请求的东西。发觉自己看源码不太能看懂。于是,就转向看jquery中的ajax,既然jquery中由封装好的$.ajax()方法,就想从中先学会如何使用。
由于对里面的很多方法都不太理解,于是我找到并总结了比较详细的$.ajax()的方法。
如下:
1.url:
要求为String类型的参数,(默认为当前页地址)发送请求的地址。
2.type:
要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持。
3.timeout:
要求为Number类型的参数,设置请求超时时间(毫秒)。此设置将覆盖$.ajaxSetup()方法的全局设置。
4.async:
要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为false。注意,同步请求将锁住浏览器,用户其他操作必须等待请求完成才可以执行。
5.cache:
要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false),设置为false将不会从浏览器缓存中加载请求信息。
6.data:
要求为Object或String类型的参数,发送到服务器的数据。如果已经不是字符串,将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换,可以查看 processData选项。对象必须为key/value格式,例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组,JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。
7.dataType:
要求为String类型的参数,预期服务器返回的数据类型。如果不指定,JQuery将自动根据http包mime信息返回responseXML或responseText,并作为回调函数参数传递。可用的类型如下:
xml:返回XML文档,可用JQuery处理。
html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。
script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时(不在同一个域下),所有post请求都将转为get请求。
json:返回JSON数据。
jsonp:JSONP格式。使用SONP形式调用函数时,例如myurl?callback=?,JQuery将自动替换后一个“?”为正确的函数名,以执行回调函数。
text:返回纯文本字符串。
8.beforeSend:
要求为Function类型的参数,发送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参数。
function(XMLHttpRequest){
this; //调用本次ajax请求时传递的options参数
}
9.complete:
要求为Function类型的参数,请求完成后调用的回调函数(请求成功或失败时均调用)。参数:XMLHttpRequest对象和一个描述成功请求类型的字符串。
function(XMLHttpRequest, textStatus){
this; //调用本次ajax请求时传递的options参数
}
10.success:要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。
(1)由服务器返回,并根据dataType参数进行处理后的数据。
(2)描述状态的字符串。
function(data, textStatus){
//data可能是xmlDoc、jsonObj、html、text等等
this; //调用本次ajax请求时传递的options参数
}
11.error:
要求为Function类型的参数,请求失败时被调用的函数。该函数有3个参数,即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)。ajax事件函数如下:
function(XMLHttpRequest, textStatus, errorThrown){
//通常情况下textStatus和errorThrown只有其中一个包含信息
this; //调用本次ajax请求时传递的options参数
}
12.contentType:
要求为String类型的参数,当发送信息至服务器时,内容编码类型默认为"application/x-www-form-urlencoded"。该默认值适合大多数应用场合。
13.dataFilter:
要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
function(data, type){
//返回处理后的数据
return data;
}
14.dataFilter:
要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数。data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
function(data, type){
//返回处理后的数据
return data;
}
15.global:
要求为Boolean类型的参数,默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局ajax事件,ajaxStart或ajaxStop可用于控制各种ajax事件。
16.ifModified:
要求为Boolean类型的参数,默认为false。仅在服务器数据改变时获取新数据。服务器数据改变判断的依据是Last-Modified头信息。默认值是false,即忽略头信息。
17.jsonp:
要求为String类型的参数,在一个jsonp请求中重写回调函数的名字。该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,例如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。
18.username:
要求为String类型的参数,用于响应HTTP访问认证请求的用户名。
19.password:
要求为String类型的参数,用于响应HTTP访问认证请求的密码。
20.processData:
要求为Boolean类型的参数,默认为true。默认情况下,发送的数据将被转换为对象(从技术角度来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM树信息或者其他不希望转换的信息,请设置为false。
21.scriptCharset:
要求为String类型的参数,只有当请求时dataType为"jsonp"或者"script",并且type是GET时才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。
其中的datatype,可以由json以及jsonp。不太明白之间区别,要多看多学习。
今天的博客就写到这里吧!
分享到:
相关推荐
通过理解并熟练掌握AJAX的异步通信机制以及JSON的数据交换格式,开发者能够构建出更加高效、流畅的Web应用。在实际开发中,还需要考虑错误处理、安全性、性能优化等多方面因素,确保系统的稳定性和可靠性。
在处理Ajax返回的JSON(JavaScript Object Notation)数据时,可能会遇到一些问题,尤其是当JSON数据中包含换行符时。本文将深入探讨这个问题,以及如何正确地处理这种情况。 首先,JSON是一种轻量级的数据交换格式...
总结来说,本实例的核心是利用AJAX技术从服务器获取复杂的JSON数据,并对其进行解析和处理。理解AJAX的工作原理、JSON的结构以及如何在JavaScript中操作JSON是Web开发者必备的技能。在实际应用中,你可能还需要处理...
源码文件"一头扎进Ajax&Json视频教程源码.rar"可能包含了与视频教程配合的示例代码,你可以通过学习这些代码加深对Ajax和Json实际应用的理解。通过动手实践,你可以更好地掌握这些技术,并在自己的项目中运用自如。 ...
在Ajax的回调函数中,接收到JSON数据后,可以通过JSON.parse()方法将其转换为JavaScript对象,然后进行操作。 ```javascript if (xhr.readyState == 4 && xhr.status == 200) { var jsonData = JSON.parse(xhr....
5. **响应的处理**:Ajax请求成功后,会触发`onreadystatechange`事件,当状态变为4(表示请求已完成)且状态码为200(表示成功)时,可以读取`responseText`或`responseJSON`获取返回的JSON数据。 6. **DOM操作**...
总结来说,"Ajax返回JSON对象"涉及到的技术点包括Ajax的基本使用、JSON数据格式、Ajax发送和接收JSON数据的流程、jQuery对Ajax的支持、跨域请求以及安全性和错误处理。这些都是Web开发中不可或缺的知识点,理解和...
总结一下,使用jQuery通过Ajax处理JSON数据主要涉及以下几个步骤: 1. 使用$.ajax()、$.getJSON()、$.get()或$.post()发起请求。 2. 设置`dataType: 'json'`,让jQuery自动解析返回的数据。 3. 在回调函数中处理解析...
例如,当使用jQuery的AJAX方法(如`$.ajax()`或`$.getJSON()`)时,服务器返回的JSON数据可以自动解析成JavaScript对象。 **jQuery的AJAX功能** jQuery是一个流行的JavaScript库,它简化了JavaScript的许多操作,...
1. **数据结构**:JSON数据格式类似于JavaScript的对象字面量,由键值对组成,用花括号`{}`包围。键用双引号`"`包裹,值可以是字符串、数字、布尔值、数组、null或者嵌套的JSON对象。 2. **序列化和反序列化**:在...
然而,XML实际上并不是Ajax传输数据的唯一格式,JSON(JavaScript Object Notation)现在已经成为更常见且更受欢迎的数据交换格式,因为它更简洁、更易于解析,并且被广泛支持。 JSON是一种轻量级的数据交换格式,...
2. **JSON数据格式**:理解JSON的基本语法,包括键值对、对象和数组。例如,`{"name": "John", "age": 30}`是一个简单的JSON对象。 3. **jQuery与Ajax**:许多初学者会使用jQuery库简化Ajax操作,如`$.ajax()`, `$....
这些文件可能包含了如何在Java中生成和解析JSON的示例,或者是使用Ajax与服务器交换JSON数据的JavaScript代码。通过学习这些文件,开发者可以加深对Java、Ajax和JSON集成的理解,提升Web应用程序的开发能力。 总的...
在探讨如何利用jQuery的AutoComplete插件结合Ajax与JSON数据实现自动补全功能之前,我们首先需要理解几个关键概念:jQuery、Ajax、JSON以及AutoComplete。 ### jQuery简介 jQuery是一款快速、简洁的JavaScript库,...
这个简单的demo是一个很好的学习资源,帮助初学者理解如何使用jQuery的AJAX功能与后端Servlet交互,以及如何使用JSON进行数据交换。通过实践这个demo,你可以更深入地了解这些技术的实际应用。同时,它也展示了Web...
首先,我们需要理解JSON数据结构。在示例中,返回的JSON数据是一个二维数组,形如`[{key,val},{key,val},{key,val}]`。这种格式表示一个数组,其中每个元素本身又是一个键值对的对象。在JavaScript中,可以方便地...
在这个函数中,使用了$.each()方法来遍历返回的JSON数据,对每一个对象进行处理,然后将处理后的结果追加到ID为"result"的DOM元素中。 具体操作中,`content`变量构建了一个字符串,包含了当前对象的所有属性值,并...
jQuery内置了对Ajax的支持,简化了异步请求的编写。主要的Ajax方法有: 1. **$.ajax()**:这是最全面的Ajax方法,可以自定义各种参数,如URL、类型(GET或POST)、数据、回调函数等。 2. **$.get()**和**$.post()**...
这些资源可能涵盖如何创建Ajax请求,如何处理JSON数据,以及在各种场景下应用Ajax和JSON的最佳实践。对于初学者或正在开发需要动态数据加载功能的Web应用的开发者来说,这是一个非常有价值的资源。 总的来说,Ajax...
【标题】"maven+ajax+json" 描述了在软件开发中,使用Maven构建项目,通过Ajax技术处理JSON数据的方式。这是一个典型的前后端交互场景,涉及到的技术栈包括Maven(项目管理工具)、Ajax(异步JavaScript和XML)以及...