JSON

1、定义

JSON(JavaScript Object Notation, JS 对象简谱)是一种轻量级的数据交换格式。它基于 ECMAScript (欧洲计算机协会制定的 JS 规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率

2、格式

JSON 就是一种有格式的字符串。
任何支持的类型都可以通过 JSON 来表示,例如字符串、数字、对象、数组等。但是对象和数组是比较特殊且常用的两种类型。

规则如下:

  • 映射用冒号(“:”)表示。”名称” : 值,标准格式名称用双引号括起来;
  • 并列的数据之间用逗号(“,”)分隔。”名称1” : 值1, ”名称2” : 值2;
  • 映射的集合(对象)用大括号(“{}”)表示。{”名称1” : 值1, ”名称2”: 值2}
  • 并列数据的集合(数组)用方括号(“[]”)表示。示例如下:
    [
    {”名称1” : 值, ”名称2” : 值2},
    {”名称1” : 值, ”名称2” : 值2}
    ]
  • 元素值可具有的类型:string,number,object,array,true,false,null。
1
{名称1 : 值, 名称2 : 值2}		// 在 js 中可以不用双引号

AJAX 概述

1、AJAX介绍

1>AJAX 不是一项具体的技术,而是几门技术的综合应用。Javascript、XHTML和CSS、DOM、XML和XMLHttpRequest。

2>AJAX 核心只不过是要在 Javascript 中调用一个叫 XMLHttpRequest 类,这个类可以与 Web 服务器使用 HTTP 协议进行交互,程序不通过浏览器发出请求,而是用这个特殊的 JavaScript 对象发送请求和接收响应。

3>XMLHttpRequest 对象在网络上的俗称为 AJAX 对象

2、AJAX 特点

浏览器中显示一个页面后,这个页面以后一直不改变,所有的操作请求都由这个网页中的 Javascript 代码发出,所有的结果都由 Javascript 代码接受并增加到这个页面上,浏览器窗口中显示的网页始终都是初始的那个网页。
增强用户体验:可以在用户浏览网页的同时与服务器进行异步交互和实现网页内容的局部更新

同步和异步交互:

同步:提交请求 —> 等待服务器处理 —> 处理完毕返回 这个期间客户端浏览器不能干任何事。同步是指:发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式。
异步:请求通过事件触发 —> 服务器处理(这时浏览器仍然可以作其他事情)—> 处理完毕。异步是指:发送方发出数据后,不等接收方发回响应,接着发送下个数据包的通讯方式。

3、AJAX缺陷

  • AJAX 大量使用了 Javascript 和 AJAX 引擎,而这个取决于浏览器的支持。IE5.0 及以上、Mozilla1.0、NetScape7 及以上版本才支持,Mozilla 虽然也支持 AJAX ,但是提供 XMLHttpRequest 的方式不一样。所以,使用 AJAX 的程序必须测试针对各个浏览器的兼容性。
  • AJAX 更新页面内容的时候并没有刷新整个页面,因此,网页的后退功能是失效的;有的用户还经常搞不清楚现在的数据是旧的还是已经更新过的。这个就需要在明显位置提醒用户“数据已更新”。
  • 对流媒体的支持没有 Flash、Java Applet 好。
  • AJAX 不支持跨域访问(可以通过配置解决)。

jQuery 中 AJAX API

1、jQuery.ajax([options])

1
2
3
4
5
6
7
8
9
10
$.ajax({
url: "请求路径",
type: "发送类型(如: put、delete)",
data: {
id: id // 传递的数据 json 格式
},
success: function ([参数]) { // 根据情况是否添加参数(下同)
// TODO
}
})

2、jQuery.get(url, [data], [callback], [type])

1
2
3
4
$.get("请求路径", "json(最好) 格式的数据", function ([参数]) {
// TODO
}
})

3、jQuery.post(url, [data], [callback], [type])

1
2
3
4
$.post("请求路径", "json(最好) 格式的数据", function ([参数]) {
// TODO
}
})