以前传统的网页(不使用 Ajax)如果需要更新内容,就必须重新加载整个网页。当一个页面有 大量的 JavaScript、图片、CSS 时,加载速度会变得非常缓慢。而 Ajax 的出现很好地解决了这个问题。
Ajax(Asynchronous JavaScript And XML,异步 JavaScript 和 XML)是指一种用于创建快速动 态网页的开发技术。它无须重新加载整个网页,通过在后台与服务器进行少量数据交换,即可异 步更新部分网页。这意味着可以在不重新加载整个网页的情况下,对网页的某些部分进行更新。 由于 Ajax 是按需取数据,减少了冗余请求和响应对服务器造成的负担,因此异步请求响应快,用 户体验很好。Ajax 的工作原理如下图所示:
需要注意的是在使用 Ajax 之前需要引入 jQuery:
<script type="text/javascript" SRC="js/jquery-1.8.2.js"></script>
Ajax 常用的格式如下:
Ajax 大多数时候设置服务器返回的数据类型为 JSON。JSON 是 JavaScript 对象表示法,是存 储和交换文本信息的语法,类似 XML,但比 XML 更小、更快、更易解析、更灵巧。所以,JSON 是一种轻量级的数据交换格式,基于 ECMAScript(欧洲计算机协会制定的 JavaScript 规范)的 一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言,易于人阅读和编写,同时也易于机器解析和生成,并有效地提升 网络传输效率。
JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在网络或程序之间 轻松地传递这个字符串,并在需要时将它还原为各编程语言所支持的数据格式,也就是说,JSON 对象就是 JavaScript 对象的子集而已。一般 JSON 格式的字符串转化完毕后会变成数组对象。
举个最简单的例子,通过 Ajax 从后台返回一段 JSON 数据。
{ person: [{"name":"linda"}, {"from":"Shanghai"}] }
前端用 JavaScript 读取这一段 JSON 并赋值给 data,这样就可以轻松地提取我们想要的数据了。
data.person[0].name
data.person.length
Ajax分为同步与异步:
1)同步:发送?个请求,需要等待响应返回,然后才能够发送下?个请求,如果该请求没有响应,不能发送下?个请求,客户端会处于?直等待过程中。(async:false)
2)异步:发送?个请求,不需要等待响应返回,随时可以再发送下?个请求,即不需要等待。一般默认为异步。(async:true)
Json是一种轻量级的数据交换格式,它的规格非常简单:
1) 并列的数据之间用逗号(", ")分隔。
2) 映射用冒号(": ")表示。
3) 并列数据的集合(数组)用方括号("[]")表示。
4) 映射的集合(对象)用大括号("{}")表示。
JSON格式中的“名称/值”对的集合是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’对”之间使用“,”(逗号)分隔。例如:{“firstName":"Linda",”lastName":"Ying"}