js Web存储方式
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存储方式的更多相关文章
- 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 ...
- HTML5新增web存储方式
客户端存储数据的两个对象为: 两个对象在使用方式没有任何区别,唯一的不同点蚀储存数据 的有效时间 ①localStorage - 没有时间限制的数据存储 除非手动删除,否则数据将一直保存在本地文件: ...
- Node.js 数据存储方式的选择
如何为你的 Node.js 应用挑选数据库 Node.js 应用一般有三种方式保存数据. 不使用任何数据库管理系统(DBMS),把数据保存在内存里或直接使用文件系统. 使用关系数据库.例如 MySQL ...
- 【归纳整理】Ajax / JSON / WEB存储 / iframe
Ajax 一.什么是 AJAX ? AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 是一种用于创建快速动态网页 ...
- HTML5 Web 客户端五种离线存储方式汇总
最近折腾HTML5游戏需要离线存储功能,便把目前可用的几种HTML5存储方式研究了下,基于HT for Web写了个综合的实例,分别利用了Cookie.WebStorage.IndexedDB以及Fi ...
- Web客户端的几种存储方式
1.Cookie 在H5之前,cookie是主要的存储方式.cookie可以兼容到包括ie6以上的所有浏览器. Cookie数据会带到请求头的cookie字段里面,每次同主域名的请求中,都会传递数据, ...
- js三种存储方式区别
javaScript有三种数据存储方式,分别是: sessionStorage localStorage cookier 相同点:都保存在浏览器端,同源的 不同点: ①传递方式不同 cookie数据始 ...
- js 三种存储方式的区别
javaScript有三种数据存储方式,分别是: sessionStorage localStorage cookie 相同点:都保存在浏览器端,同源的 不同点: ①传递方式不同 cookie数据始终 ...
- 前端HTML5几种存储方式的总结
接下来要好好总结一些知识,秋招来啦...虽然有好多知识都不大会,但是还是要努力一下,运气这种东西,谁知道呢~ 总体情况 h5之前,存储主要是用cookies.cookies缺点有在请求头上带着数据,大 ...
随机推荐
- input file样式修改,图片预览删除功能
本篇对input file进行了修改,改成自己需要的样式,类似验证身份上传身份证图片的功能. 效果图如下: 这里主要展示上传预览图片功能,对于删除功能的html及css写的比较粗糙,对于想要精细表现这 ...
- 一个想法照进现实-《IT连》创业项目:聊聊IT连App是如何思考解决IT人员单身问题的
前言: 根据最早我编写的IT联盟社区众筹计划书的思路方向:社交->资讯=>评级=>培训. 现在在实现第一个阶段中,而且这个阶段可能会走很久. 今天开文,主要是讲述一下,现在的版本为什 ...
- 安徽省2016“京胜杯”程序设计大赛_I_恶魔A+B
恶魔A+B Time Limit: 1000 MS Memory Limit: 65536 KB Total Submissions: 73 Accepted: 17 Description 相信大家 ...
- Centos 7.3 安装mysql5.7.19 各种调试就不多说了
mysql 5.7.19linux-glibc2.12 (x86_64) 安装 1.在安装目录进行解压2.mv解压目录为mysql3.创建mysql的用户 useradd -s /sbin/nolon ...
- 【head first python】2.共享你的代码 函数模块
#coding:utf-8 #注释代码! #添加两个注释,一个描述模块,一个描述函数 '''这是nester.py模块,提供了一个名为print_lol()的函数, 这个函数的作用是打印列表,其中可能 ...
- MySQL中索引的基础知识
本文是关于MySQL中索引的基础知识.主要讲了索引的意义与原理.创建与删除的操作.并未涉及到索引的数据结构.高性能策略等. 一.概述 1.索引的意义:用于提高数据库检索数据的效率,提高数据库性能. 数 ...
- POSTMAN-REST Client
下载方式:翻.墙安装 #使用的时候不用翻.墙 下载地址:https://chrome.google.com/webstore/search/postman%20rest%20client Po ...
- python对字符串分割和截取的方法
对字符串的截取我们可以使用split方法,split是分割的按照不同分隔符来分割 现在我们想对正则匹配的内容进行截取 我们先看一下split怎么实现字符串分割 >>> b='aa ...
- 基于tgp协议的套接字的 粘包解决
客户端 import socket import struct import json phone = socket.socket(socket.AF_INET, socket.SOCK_STREAM ...
- 开机后发现Win7桌面上什么都没有该如何恢复
开机后发现Win7桌面上什么都没有该如何恢复 win7桌面上什么都没有该如何恢复:当我们打开电脑,发现win7桌面上什么都没有,那么该如何恢复呢?下面由我来介绍windows7桌面上图标不显示的解决方 ...