从 W3Schools.cn 开始学习 WEB 编程技术

JS 教程

JS HOME JS Introduction JS Where To JS Output JS Statements JS Syntax JS Comments JS Variables JS Operators JS Arithmetic JS Assignment JS Data Types JS Functions JS Objects JS Events JS Strings JS String Methods JS Numbers JS Number Methods JS Arrays JS Array Methods JS Array Sort JS Array Iteration JS Dates JS Date Formats JS Date Get Methods JS Date Set Methods JS Math JS Random JS Booleans JS Comparisons JS Conditions JS Switch JS Loop For JS Loop While JS Break JS Type Conversion JS Bitwise JS RegExp JS Errors JS Scope JS Hoisting JS Strict Mode JS this Keyword JS Let JS Const JS Arrow Function JS Classes JS Debugging JS Style Guide JS Best Practices JS Mistakes JS Performance JS Reserved Words JS Versions JS Version ES5 JS Version ES6 JS JSON

JS 表单

JS Forms Forms API

JS 对象

Object Definitions Object Properties Object Methods Object Display Object Accessors Object Constructors Object Prototypes Object ECMAScript 5

JS 函数

Function Definitions Function Parameters Function Invocation Function Call Function Apply Function Closures

JS 库类

Class Intro Class Inheritance Class Static

JS 异步

JS Callbacks JS Asynchronous JS Promises JS Async/Await

JS HTML DOM

DOM Intro DOM Methods DOM Document DOM Elements DOM HTML DOM CSS DOM Animations DOM Events DOM Event Listener DOM Navigation DOM Nodes DOM Collections DOM Node Lists

JS 浏览器BOM

JS Window JS Screen JS Location JS History JS Navigator JS Popup Alert JS Timing JS Cookies

JS AJAX

AJAX Intro AJAX XMLHttp AJAX Request AJAX Response AJAX XML File AJAX PHP AJAX ASP AJAX Database AJAX Applications AJAX Examples

JS JSON

JSON Intro JSON Syntax JSON vs XML JSON Data Types JSON Parse JSON Stringify JSON Objects JSON Arrays JSON PHP JSON HTML JSON JSONP

JS Web APIs

Web API Intro Web History API Web Storage API Web Geolocation API

JS vs jQuery

jQuery Selectors jQuery HTML jQuery CSS jQuery DOM

JS 实例

JS Examples JS HTML DOM JS HTML Input JS HTML Objects JS HTML Events JS Browser JS Editor JS Exercises JS Quiz

JS 参考手册

JavaScript 对象 HTML DOM 对象


JSON 简介

JSON: JavaScript Object Notation(JavaScript 对象标记法)。

JSON 是一种存储和交换数据的语法。

JSON 是通过 JavaScript 对象标记法书写的文本。


交换数据

当数据在浏览器与服务器之间进行交换时,这些数据只能是文本。

JSON 属于文本,并且我们能够把任何 JavaScript 对象转换为 JSON,然后将 JSON 发送到服务器。

我们也能把从服务器接收到的任何 JSON 转换为 JavaScript 对象。

以这样的方式,我们能够把数据作为 JavaScript 对象来处理,无需复杂的解析和转译。


发送数据

如果您的数据存储在 JavaScript 对象中,您可以把该对象转换为 JSON,然后将其发送到服务器。

实例

var myObj = {name: "John", age: 31, city: "New York"};
var myJSON = JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;
亲自试一试 »

You will learn more about the JSON.stringify() function later in this tutorial.


接收数据

如果您以 JSON 格式接收到数据,您能够将其转换为 JavaScript 对象:

实例

var myJSON = '{"name":"John", "age":31, "city":"New York"}';
var myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
亲自试一试 »

You will learn more about the JSON.parse() function later in this tutorial.



存储数据

在存储数据时,数据必须是某种具体的格式,并且无论您选择在何处存储它,文本永远是合法格式之一。

JSON 让 JavaScript 对象存储为文本成为可能。

实例

把数据存储在本地存储中

// Storing data:
myObj = {name: "John", age: 31, city: "New York"};
myJSON = JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);

// Retrieving data:
text = localStorage.getItem("testJSON");
obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;
亲自试一试 »

什么是 JSON?

  • JSON 指的是 JavaScript 对象标记法(JavaScript Object Notation)
  • JSON 是一种轻量级的数据交换格式
  • JSON 具有自我描述性且易于理解
  • JSON 独立于语言*

*

JSON 使用 JavaScript 语法,但是 JSON 格式是纯文本的。

文本可被任何编程语言作为数据来读取和使用。

JSON 格式最初由 Douglas Crockford 提出。

The JSON format was originally specified by Douglas Crockford.


为什么使用 JSON?

因为 JSON 格式仅仅是文本,它能够轻松地在服务器浏览器之间传输,并用作任何编程语言的数据格式。

JavaScript 提供內建函数把以 JSON 格式写的字符串转换为原生 JavaScript 对象:

JSON.parse()

因此,如果您以 JSON 格式从服务器接收数据,那么您可以像任何其他 JavaScript 对象那样使用它。