jQuey知识点三 解析json数据
1.解析简单数据
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index4</title>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<style type="text/css">
body {
font-size: 13px;
}
.iframe {
width: 260px;
border: solid 1px #;
}
.iframe .title {
padding: 5px;
background-color: #eee;
}
.iframe .content {
padding: 8px;
font-size: 12px;
}
.btn {
border: # 1px solid;
padding: 2px;
width: 80px;
}
</style>
<script type="text/javascript">
var objInfo = {
'name': '张三',
'sex ': '男',
'email': 'hahada@126.com'
}
$(function () {
$("#Button1").click(function () {
var strHtml = "";
strHtml += "姓名:" + objInfo.name + "<br/>";
strHtml += "性别:" + objInfo.sex + "<br/>";
strHtml += "邮箱:" + objInfo.email + "<br/>";
$("#Tip").html(strHtml);
});
});
</script>
</head>
<body>
<div class="iframe">
<div class="title">
<input id="Button1" type="button" clss="btn" value="获取数据" />
</div>
<div class="content">
<div id="Tip"></div>
</div>
</div>
</body>
</html>
2.jQ遍历json 数据
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>jQ遍历json数据</title>
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<style type="text/css">
body {
font-size: 13px;
}
body {
font-size: 13px;
}
.iframe {
width: 260px;
border: solid 1px #;
}
.iframe .title {
padding: 5px;
background-color: #eee;
}
.iframe .content {
padding: 8px;
font-size: 12px;
}
.btn {
border: # 1px solid;
padding: 2px;
width: 80px;
}
</style>
<script type="text/javascript">
var objData = {
member: [
{ grade: "一年级", students: { name: ["张三", "李思", "王五"] } },
{ grade: "二年级", students: { name: ["蝴蝶结款", "但是", "给答复五"] } },
{ grade: "三年级", students: { name: ["张数据库", "东方闪电", "放不开"] } }
]
};
function add_Grade() {
var objmember = objData.member;
var strHtml_0 = "";
$.each(objmember, function (index) {
strHtml_0 += '<a href="javascript:"onclick="link_click(' + index + ')">' + objmember[index].grade + "</a>  "
});
$(".title").html("年级优秀学生:" + strHtml_0);
};
function link_click(i) {
var objStudent = objData.member[i].students.name;
var strHtml_1 = "";
$.each(objStudent, function (index) {
strHtml_1 += " " + objStudent[index] + " ";
});
$("#Tip").html(strHtml_1);
}
$(function () {
add_Grade();
link_click();
});
</script>
</head>
<body>
<div class="iframe">
<div class="title"></div>
<div class="content">
<div id="Tip"></div>
</div>
</div>
</body>
</html>
jQuey知识点三 解析json数据的更多相关文章
- Java创建和解析Json数据方法(三)——json-lib包的使用
(三)json-lib包的使用 这篇笔记主要介绍json-lib包的创建和解析json数据的方式,主要是的JSONObject.JSONArray和Java对象:beans, maps ...
- C# JavaScriptSerializer 解析Json数据(多方法解析Json 三)
准备工作: 1.添加引用System.Web.Extensions, 2..net3.5+版本都有,如果VS2010找不到,在这个文件夹找:C:\Program Files\Reference Ass ...
- 使用jQuery解析JSON数据
我们先以解析上例中的comments对象的JSON数据为例,然后再小结jQuery中解析JSON数据的方法. 上例中得到的JSON数据如下,是一个嵌套JSON: {"comments&quo ...
- 用jquery解析JSON数据的方法以及字符串转换成json的3种方法
用jquery解析JSON数据的方法,作为jquery异步请求的传输对象,jquery请求后返回的结果是 json对象,这里考虑的都是服务器返回JSON形式的字符串的形式,对于利用JSONObject ...
- Android中使用Gson解析JSON数据的两种方法
Json是一种类似于XML的通用数据交换格式,具有比XML更高的传输效率;本文将介绍两种方法解析JSON数据,需要的朋友可以参考下 Json是一种类似于XML的通用数据交换格式,具有比XML更高的 ...
- Android网络之数据解析----使用Google Gson解析Json数据
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/4 ...
- 使用jQuery解析JSON数据(由ajax发送请求到php文件处理数据返回json数据,然后解析json写入html中呈现)
在上一篇的Struts2之ajax初析中,我们得到了comments对象的JSON数据,在本篇中,我们将使用jQuery进行数据解析. 我们先以解析上例中的comments对象的JSON数据为例,然后 ...
- Java构造和解析Json数据的两种方法详解二
在www.json.org上公布了很多JAVA下的json构造和解析工具,其中org.json和json-lib比较简单,两者使用上差不多但还是有些区别.下面接着介绍用org.json构造和解析Jso ...
- Java构造和解析Json数据的两种方法详解一
一.介绍 JSON-lib包是一个beans,collections,maps,java arrays 和XML和JSON互相转换的包,主要就是用来解析Json数据,在其官网http://www.js ...
随机推荐
- mysql
这是 <MySQL 必知必会> 的读书总结.也是自己整理的常用操作的参考手册. 使用 MySQL 连接到 MySQL shell>mysql -u root -p Enter pas ...
- MySQL 5.7.10 自动备份、自动清理旧备份集
http://blog.csdn.net/mchdba/article/details/51527081 MySQL版本是5.7.10-log社区版本,需要进行备份,但是备份时间长了后,磁盘不够用,所 ...
- [已解决]Windows10 系统下HDMI 显示器 没有声音输出的奇怪问题
今天想用一下显示器自带的喇叭,忽然发现声音输出选项里HDMI的声音设备没了.之前开始使用这台显示器的时是用过一段时间的. 百度了一番,没发现什么线索.后来去谷歌找到这么一段文字: I'm not su ...
- HDOJ 1051. Wooden Sticks 贪心 结构体排序
Wooden Sticks Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) To ...
- python flask (一)
from flask import Flask app = Flask(__name__) @app.route('/') def hello_world(): return 'Hello World ...
- 杂项之使用qq邮箱发送邮件
杂项之使用qq邮箱发送邮件 本节内容 特殊设置 测试代码 1. 特殊设置 之前QQ邮箱直接可以通过smtp协议发送邮件,不需要进行一些特殊的设置,但是最近使用QQ邮箱测试的时候发现以前使用的办法无法奏 ...
- 新手学跨域之iframe
https://segmentfault.com/a/1190000000702539 页面嵌套iframe是比较常见的,比如QQ相关业务页面的登录框一般都是iframe的.使用ifrmae跨域要满足 ...
- [LeetCode] Count Univalue Subtrees 计数相同值子树的个数
Given a binary tree, count the number of uni-value subtrees. A Uni-value subtree means all nodes of ...
- FineUI(开源版)v4.2.2发布(8年125个版本,官网示例突破300个)!
开源版是 FineUI 的基石,从 2008 年至今已经持续发布了 120 多个版本,拥有会员 15,000 多位,捐赠会员达到 1,200 多位. FineUI(开源版)v4.2.2 是 8 年 ...
- IT培训行业揭秘(五)
前面说了一大堆,简单揭露了一些目前培训行业鱼龙混在的情况,那么今天我就站在一个即将毕业的大学生角度来谈谈如何选择一个靠谱的培训机构. 你即将大学毕业了,在大学里面浑浑噩噩的混了几年,马上就要离开校园, ...