json数据的格式,JavaScript、jQuery读取json数据
JSON:JavaScript 对象表示法(JavaScript Object Notation)。
JSON的特点:
JSON 是纯文本
JSON 具有“自我描述性”(人类可读)
JSON 具有层级结构(值中存在值)
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输
JSON 语法规则
JSON 语法是 JavaScript 对象表示法语法的子集。
- 数据在名称/值对中
"name" : "soulsjie"
- 数据由逗号分隔
"firstName":"John" , "lastName":"Doe"
- 花括号保存对象
{ "name":"soulsjie" , "sex":"男" }
- 方括号保存数组
{
"info": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
数据访问:
employees[0].lastName;
结果是:Gates
数据格式:
var info= {
"myname":"soulsjie",
"myage":18,
"myclass":"3班",
"myphone":"11121212154"
};
JavaScript读取json的实例:
<html>
<body>
<h2>在 JavaScript 中创建 JSON 对象</h2>
<p>
姓名: <span id="myname"></span><br />
年龄: <span id="myage"></span><br />
班级: <span id="myclass"></span><br />
手机: <span id="myphone"></span><br />
</p>
<script type="text/javascript">
var info= {
"myname":"soulsjie",
"myage":18,
"myclass":"3班",
"myphone":"11121212154"};
document.getElementById("myname").innerHTML=info.myname
document.getElementById("myage").innerHTML=info.myage
document.getElementById("myclass").innerHTML=info.myclass
document.getElementById("myphone").innerHTML=info.myphone
</script>
</body>
</html>
jQuery读取json数据实例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="libs/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//创建json格式的数据
var info= {
"myname":"soulsjie",
"myage":18,
"myclass":"3班",
"myphone":"11121212154"
};
$("button").click(function(){//读取json的数据
$(".t1").html(info.myname);
$(".t2").html(info.myage);
$(".t3").html(info.myclass);
});
});
</script>
</head>
<body>
<button>获取JSON格式数据</button>
<p>
姓名:<span class="t1"></span><br/>
年龄:<span class="t2"></span><br/>
班级:<span class="t3"></span><br/>
</p>
</body>
</html>
利用eval ()将json字符串转换为json对象:
//json字符串
var test = '{ "student" : [' +
'{ "name":"stu1" , "age":15 },' +
'{ "name":"stu2" , "age":16 },' +
'{ "name":"stu3" , "age":20 } ]}';
//转换成json对象
var objtest = eval ("(" + test + ")");
$("button").click(function(){//读取json的数据
alert(objtest.student[0].name);
});
});
json数据的格式,JavaScript、jQuery读取json数据的更多相关文章
- Javascript/jQuery关于JSON或数组集合的几种循环方法
JavaScript遍历JSON或数组集合: /** * 根据json数据生成option树形控件 * 如果有children节点则自动生成树形数据 * @param {JSON} data * @p ...
- jQuery读取json文件,实现省市区/县(国标)三级联动
最近做一个微信项目,需要用户填写所在的省市区/县,决定使用jQuery读取json文件来实现省市区/县的联动. 其实很简单,jQuery文档也有详细解释: 代码如下: html <table w ...
- 常用两种数据交换格式之XML和JSON的比较
目前,在web开发领域,主要的数据交换格式有XML和JSON,对于XML相信每一个web developer都不会感到陌生: 相比之下,JSON可能对于一些新步入开发领域的新手会感到有些陌生,也可能你 ...
- javascript/jquery读取和修改HTTP headers
javascript/jquery读取和修改HTTP headers jquery修改HTTP headers jQuery Ajax可以通过headers或beforeSend修改request的H ...
- EF+LINQ事物处理 C# 使用NLog记录日志入门操作 ASP.NET MVC多语言 仿微软网站效果(转) 详解C#特性和反射(一) c# API接受图片文件以Base64格式上传图片 .NET读取json数据并绑定到对象
EF+LINQ事物处理 在使用EF的情况下,怎么进行事务的处理,来减少数据操作时的失误,比如重复插入数据等等这些问题,这都是经常会遇到的一些问题 但是如果是我有多个站点,然后存在同类型的角色去操作 ...
- jQuery读取JSON总结
1.jQuery 部分 <script src="js/jquery.js" type="text/javascript"></script& ...
- 两种常用的数据交换格式:XML和JSON
不同编程语言之间的数据传输,需要一种通用的数据交换格式,它需要简洁.易于数据储存.快速读取,且独立于各种编程语言.我们往往传输的是文本文件,比如我们都知道的csv(comma seperated va ...
- (The application/json Media Type for JavaScript Object Notation (JSON))RFC4627-JSON格式定义
原文 http://laichendong.com/rfc4627-zh_cn/ 摘要 JavaScript Object Notation (JSON)是一个轻量级的,基于文本的,跨语言的数据交换 ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
随机推荐
- ROS学习笔记十一:创建URDF 文件并在RVIZ中查看模型
Unified Robot Description Format,简称为URDF(标准化机器人描述格式),是一种用于描述机器人及其部分结构.关节.自由度等的XML格式文件. 一.创建第一个URDF文件 ...
- 【BZOJ3309】DZY Loves Math(线性筛)
题目: BZOJ 3309 分析: 首先,经过一番非常套路的莫比乌斯反演(实在懒得写了),我们得到: \[\sum_{T=1}^n \sum_{d|T}f(d)\mu(\frac{T}{d})\lfl ...
- 水题 Codeforces Round #308 (Div. 2) A. Vanya and Table
题目传送门 /* 水题:读懂题目就能做 */ #include <cstdio> #include <iostream> #include <algorithm> ...
- 数据库执行计划慢导致I/O 慢
Memory Statistics~~~~~~~~~~~~~~~~~ Begin End ------------ ------------ Host Mem (MB): 16,338.5 16,33 ...
- 【intellij idea】汇总
1 右键无法创建,找不到scala class https://blog.csdn.net/u011513853/article/details/52896230 2 缩进 https://jingy ...
- 用pycharm+django开发web项目
pycharm是python的一个商业的集成开发工具,本人感觉做python开发还是很好用的,django是一个很流行的python web开源框架,本文就是使用pycharm+django来开发py ...
- IIS ARR(Application Request Route)与反向代理(Reverse Proxy)
为何要用反向代理? 这里说说我的场景, 我在服务器上假设了SVN(Visual SVN)用的端口是:8080, 而我想通过输入svn.niusys.com就可以访问我的SVN服务器,也就是要通过80端 ...
- Winsock2_WSADATA
使用Winsock2进行win下网络编程的第一步是初始化Winsock.其中需要创建一个WSADATA类型的变量,这个变量用来保存Windows socket的实现信息. typedef struct ...
- 数组,寻找第K大的数
时间复杂度 O(n) def partition(data,left,right): if (len(data)<=0 or left<0 or right>=len(data)): ...
- C# 获取文件编码
using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Tex ...