JSON是数据交互中最常用的一种数据格式。

由于各种语言的语法都不同,在传递数据时,可以将自己语言中的数组、对象等转换为JSON字符串》
传递之后,可以讲JSON字符串,在解析为JSON对象。

JSON 对象的用法与js中的对象基本相同,唯一需要区别的是,JSON中的键,必须是字符串。

JSON 名称/值对

JSON 数据的书写格式是:名称/值对。

eg:   "name" : "1111"

JSON 值

JSON 值可以是:

● 数字(整数或浮点数)

● 字符串(在双引号中)

● 逻辑值(true 或 false)

● 数组(在中括号中)

● 对象(在大括号中)

● null

JSON 数字

JSON 数字可以是整型或者浮点型:

{ "age":30 }

JSON 对象

JSON 对象在大括号({})中书写:

对象可以包含多个 key/value(键/值)对。

key 必须是字符串,value 可以是合法的 JSON 数据类型(字符串, 数字, 对象, 数组, 布尔值或 null)。

key 和 value 中使用冒号(:)分割。

每个 key/value 对使用逗号(,)分割。

{ "name":"1111" , "url":"www.runoob.com" }

访问对象值

可以使用点号  .  来访问对象的值:

实例

var myObj, x;

myObj = { "name":"runoob", "alexa":10000, "site":null };

x = myObj.name;

也可以使用中括号  []  来访问对象的值:

实例

var myObj, x;

myObj = { "name":"runoob", "alexa":10000, "site":null };

x = myObj["name"];

JSON 数组

JSON 数组在中括号中书写:

数组可包含多个对象:

{

 "sites": [

  { "name":"1111" , "url":"www.runoob.com" },

  { "name":"google" , "url":"www.google.com" },

  { "name":"微博" , "url":"www.weibo.com" }

  ]

}

JSON 布尔值

JSON 布尔值可以是 true 或者 false:

{ "flag":true }

JSON null

JSON 可以设置 null 值:

{ "runoob":null }

JSON.parse()

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

参数说明:

● text:必需, 一个有效的 JSON 字符串。

● reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。

例如从服务器接收了以下数据:

{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }

我们使用 JSON.parse() 方法处理以上数据,将其转换为 JavaScript 对象:

var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');

JSON.stringify()

JSON 通常用于与服务端交换数据。

在向服务器发送数据时一般是字符串。

可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

语法

JSON.stringify(value[, replacer[, space]])

例如我们向服务器发送以下数据:

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};

使用 JSON.stringify() 方法处理以上数据,将其转换为字符串:

var myJSON = JSON.stringify(obj);

myJSON 为字符串。

可以将 myJSON 发送到服务器:

HTML5新增Web存储方式,主要有两种:

localStorage和sessionStorage,两个对象在使用方式没有任何区别,唯一的不同点是存储数据的有效时间

① localStorage:除非手动删除,否则数据将一直保存在本地文件。

② sessionStorage:浏览器关闭时,sessinStorage就被清空。

[Storage的数据存储]

1、Storage可以像普通对象一样,使用.追加或者读取最新的数据。

eg:localStorage = "张三";

2、常用的函数

保存数据:localStorage.setItem(key,value);

读取数据:localStorage.getItem(key);

删除单个数据:localStorage.removeItem(key);

删除所有数据:localStorage.clear();

得到某个索引的key:localStorage.key(index);

//检测浏览器是否支持

if(typeof(Storage)!=="undefined"){

alert("支持");

}else{

alert("浏览器不支持HTML5存储");

}

js Web存储方式的更多相关文章

  1. web 存储方式汇总:Cookies,Session, Web SQL; Web Storage(LocalStorage ,SessionStorage),IndexedDB,Application Cache,Cache Storage

    1 1 1 web 存储方式汇总: 旧的方式: Cookies; Session; Web SQL; 新的方式 HTML5 : Web Storage(LocalStorage ,SessionSto ...

  2. HTML5新增web存储方式

    客户端存储数据的两个对象为: 两个对象在使用方式没有任何区别,唯一的不同点蚀储存数据 的有效时间 ①localStorage - 没有时间限制的数据存储 除非手动删除,否则数据将一直保存在本地文件: ...

  3. Node.js 数据存储方式的选择

    如何为你的 Node.js 应用挑选数据库 Node.js 应用一般有三种方式保存数据. 不使用任何数据库管理系统(DBMS),把数据保存在内存里或直接使用文件系统. 使用关系数据库.例如 MySQL ...

  4. 【归纳整理】Ajax / JSON / WEB存储 / iframe

      Ajax 一.什么是 AJAX ? AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 是一种用于创建快速动态网页 ...

  5. HTML5 Web 客户端五种离线存储方式汇总

    最近折腾HTML5游戏需要离线存储功能,便把目前可用的几种HTML5存储方式研究了下,基于HT for Web写了个综合的实例,分别利用了Cookie.WebStorage.IndexedDB以及Fi ...

  6. Web客户端的几种存储方式

    1.Cookie 在H5之前,cookie是主要的存储方式.cookie可以兼容到包括ie6以上的所有浏览器. Cookie数据会带到请求头的cookie字段里面,每次同主域名的请求中,都会传递数据, ...

  7. js三种存储方式区别

    javaScript有三种数据存储方式,分别是: sessionStorage localStorage cookier 相同点:都保存在浏览器端,同源的 不同点: ①传递方式不同 cookie数据始 ...

  8. js 三种存储方式的区别

    javaScript有三种数据存储方式,分别是: sessionStorage localStorage cookie 相同点:都保存在浏览器端,同源的 不同点: ①传递方式不同 cookie数据始终 ...

  9. 前端HTML5几种存储方式的总结

    接下来要好好总结一些知识,秋招来啦...虽然有好多知识都不大会,但是还是要努力一下,运气这种东西,谁知道呢~ 总体情况 h5之前,存储主要是用cookies.cookies缺点有在请求头上带着数据,大 ...

随机推荐

  1. Mysql自动填充测试数据

    前言 最近写了两个小脚本,一个应用于Mysql的自动填充测试数据,另外一个是bash写的定期删除日志文件,两个脚本如何使用,在GitHub上面都有所说明,这里不再赘述,这里主要是想聊一下Mysql的存 ...

  2. 关于他们回答的 "怎样在桌面建一个python GUI的快捷方式" 这个问题

    在之前的2个随笔里面,有写过<找到可以解决问题的正确的人>.<如何提问>,说白了就是您需要帮助的时候,您得让对方100%懂你,否则没戏. 那么最近看到这样1个古老的问题,和一些 ...

  3. 使用node自动刷房源并发送可入住房源到邮箱

    因为住的地方离公司太远,每天上下班都要坐很久的班车,所以最近想搬到公司旁边的皖水公寓住.去问了一下公寓的客服,客服说房源现在没有了,只能等到别人退房,才能在网站上申请到. 如果纯靠手动F5刷新浏览器, ...

  4. python---scrapy之MySQL同步存储

    假设我们已经能获取到item里定义的字段的数据,接下来就需要保存item的数据到mysql数据库. pipeline用来存储item中的数据,将爬取到的数据进行二次处理 首先,要做的准备的工作,安装M ...

  5. Python 第四天

    高级特性 切片操作符 我们可以使用切片操作符获取 tuple 或者 list 中指定范围内的元素 list1 = [1,2,3,4,5,8,7,6,10] list2 = [1:3] #[2.3] l ...

  6. HTTP协议发展介绍

    HTTP协议工作于C/S架构上,是万维网服务器传输超文本到本地客户端的一种应用层协议,全称是:Hyper Text Transfer Protocol(超文本传输协议),HTTP是基于TCP/IP通信 ...

  7. IDE UltraEdit 图文激活+安装教程

    IDE UltraEdit 安装+激活图文.. ---------------- ---------------- ---------------- ---------------- -------- ...

  8. C#和NewSQL更配 —— TiDB入门(可能是C#下的全网首发)

    阅读目录 背景 TiDB是什么 环境部署 实战 性能测试 结语 一.背景 在上一篇尝试CockroachDB(传送门在此:http://www.cnblogs.com/Zachary-Fan/p/co ...

  9. Java中"==" 和 equals 的区别

    "=="比较的是地址值 equals 比较的是内容 看例子能够更加清晰的理解 eg: String s1="java",s2="java"; ...

  10. 线性代数-矩阵-【2】矩阵生成 C和C++实现

    矩阵的知识点之多足以写成一本线性代数. 所以我们把矩阵的运算封装成矩阵类.以C++为主进行详解. 点击这里可以跳转至 [1]矩阵汇总:http://www.cnblogs.com/HongYi-Lia ...