Jquery解析json字符串、json数组

最新推荐文章于 2024-04-08 11:37:14 发布
最新推荐文章于 2024-04-08 11:37:14 发布
阅读量5.3k 收藏 5
点赞数 3
分类专栏： jQuery Javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kenhins/article/details/39253377
版权

Jquery解析json字符串、json数组

<!doctype html>
<html>
	<head>
		  <meta charset="utf-8">
	 
<script src="../js/libs/jquery-1.6.2.min.js"></script>
	</head>
	
	<body>
	
<hr />
<h3>解析json字符串、json数组</h3>
<input type="button" id="jsonBtn" name="jsonBtn" value="jsonArray" />
<input type="button" id="jsonArray2" name="jsonArray2" value="jsonArray2" />		
<input type="button" id="jsonStr" name="jsonStr" value="jsonStr" />	
<input type="button" id="jsonStr2" name="jsonStr2" value="jsonStr2" />
<hr />	
<div class="jsonText">
	{"ret": 0,   "msg": "",    "is_lost":0,    "nickname": "小米",    "gender": "男",    "province": "广东",    "city": "广州",    "year": "1990",    "figureurl": "http:\/\/qzapp.qlogo.cn\/qzapp\/101152201\/D87BF108B19279F31587CE96E5648A98\/30",    "figureurl_1": "http:\/\/qzapp.qlogo.cn\/qzapp\/101152201\/D87BF108B19279F31587CE96E5648A98\/50",    "figureurl_2": "http:\/\/qzapp.qlogo.cn\/qzapp\/101152201\/D87BF108B19279F31587CE96E5648A98\/100",    "figureurl_qq_1": "http:\/\/q.qlogo.cn\/qqapp\/101152201\/D87BF108B19279F31587CE96E5648A98\/40",    "figureurl_qq_2": "http:\/\/q.qlogo.cn\/qqapp\/101152201\/D87BF108B19279F31587CE96E5648A98\/100",    "is_yellow_vip": "0",    "vip": "0",    "yellow_vip_level": "0",    "level": "0",    "is_yellow_year_vip": "0"}
</div>
<hr />
<div class="jsonArray">
	{   root:   
			[   
				{name:'1',value:'0'},   
				{name:'6101',value:'西安市'},   
				{name:'6102',value:'铜川市'},   
				{name:'6103',value:'宝鸡市'},   
				{name:'6104',value:'咸阳市'},   
				{name:'6105',value:'渭南市'},   
				{name:'6106',value:'延安市'},   
				{name:'6107',value:'汉中市'},   
				{name:'6108',value:'榆林市'},   
				{name:'6109',value:'安康市'},   
				{name:'6110',value:'商洛市'}   
			],
		json:   
			[   
				{name:'6103',value:'宝鸡市'},   
				{name:'6104',value:'咸阳市'},   
				{name:'6107',value:'汉中市'},   
				{name:'6108',value:'榆林市'},   
				{name:'6110',value:'商洛市'}   
			]  
    } 
</div>

<hr />
<div class="jsonArray2">
	[   
		{name:'1',value:'0'},   
		{name:'6101',value:'西安市'},   
		{name:'6102',value:'铜川市'},   
		{name:'6103',value:'宝鸡市'},   
		{name:'6104',value:'咸阳市'},   
		{name:'6105',value:'渭南市'},   
		{name:'6106',value:'延安市'},   
		{name:'6107',value:'汉中市'},   
		{name:'6108',value:'榆林市'},   
		{name:'6109',value:'安康市'},   
		{name:'6110',value:'商洛市'}   
	] 
</div>

	</body>
</html>

<script type="text/javascript">
	

    ///jQuery 解析json字符串
	
	//解析复杂的json数组
	$("#jsonBtn").click(function(){
    	var data=$(".jsonArray").html();
   	 	alert("-----"+data);
    	var dataObj=eval("("+data+")");//转换为json对象   
    	alert(dataObj.root.length);//输出root的子对象数量  
    	alert(dataObj.json.length);//输出json的子对象数量  
    	    
    	    //遍历json数组
		    $.each(dataObj.root, function(i, item) {
                alert(item.name+"-----root-------"+item.value);
            });
            
            //遍历json数组
		    $.each(dataObj.json, function(i, item) {
                alert(item.name+"-----json-------"+item.value);
            });
	});
	
		//解析单个的json数组
	$("#jsonArray2").click(function(){
    	var data=$(".jsonArray2").html();
   	 	alert("-----"+data);
    	var dataObj=eval("("+data+")");//转换为json对象   
    	alert(dataObj.length);//输出root的子对象数量  
    	    
    	    //遍历json数组
		    $.each(dataObj, function(i, item) {
                alert(item.name+"-----jsonArray-------"+item.value);
            });
	});
	
	
	
	///解析标准的Json串   方法一
	$("#jsonStr").click(function(){
    var json=$(".jsonText").html();
    alert("---2--"+json);
		   var item = jQuery.parseJSON(json);
           alert(item.nickname);
           alert(item.ret);
           alert(item.figureurl );
        
	});
	
	///解析标准的Json串，方法二
	$("#jsonStr2").click(function(){
    var json=$(".jsonText").html();
    alert("---2--"+json);
		   var obj = eval("("+json+")");
           alert(obj.nickname);
           alert(obj.ret);
           alert(obj.figureurl );
        
	});
	
	
	
</script>


运行效果图：


kenhins
关注
  • 3
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
jquery解析json格式数据的方法(对象、字符串)
weixin_30617737的博客
08-16 339
相关函数 函数描述 JSON.parse() 用于将一个 JSON 字符串转换为 JavaScript 对象。 JSON.stringify() 用于将 JavaScript 值转换为 JSON 字符串。 //data为字符串类型 则要将字符串类型转换成json数据类型 var jsondatas=eval("("+data+")");...
Jquery解析json字符串及json数组的方法
技术资料收集站
10-13 3164
本文实例讲述了Jquery解析json字符串及json数组的方法。分享给大家供大家参考。具体如下： 解析json字符串、json数组 {"ret": 0, "msg": "", "is_lost":0, "nickname": "小米", "gender": "男", "province": "广东", "city": "广州",
jq命令简易教程——Linux中处理JSON数据的利器
最新发布
洒满阳光的午后的博客
04-08 436
在shell脚本中，当我们需要对JSON数据（例如ceph、kubernetes等一些命令的输出，或是调用API获得的响应）进行处理和提取时，如果使用传统的文本三剑客sed、awk和grep，命令将会非常臃肿不可读。虽然这三个命令在处理松散结构的数据时很有用，但当面对JSON这类数据时，却显得不够优雅。
jQuery怎么解析Json字符串
gaoqiao1988的专栏
08-06 1411
jQuery怎么解析Json字符串 json数据是我们常用的一种小型的数据实时交换的一个东西，他可以利用jquery或js进行解析，下面我来介绍jquery解析json字符串方法。 一、jQuery解析Json数据格式： 使用这种方法，你必须在Ajax请求中设置参数: 1 dataType: "json"  获取通过回调函数返回的数据并解析得到我们想要
jquery遍历解析json数组
石头也有呆毛~~
04-14 1253
var json = [{dd:'SB',AA:'东东',re1:123},{cccc:'dd',lk:'1qw'}]; for(var i=0,l=json.length;i<l;i++){ for(var key in json[i]){ alert(key+':'+json[i][key]); } }
【Jquery】jQuery操作json字符串或json对象
liuzhenhe1988的专栏
03-24 1161
前言 很多时候需要将json字符串转换为json对象，然后循环处理，或是将json对象转换为json字符串作为参数传递给相关接口，接下来将介绍几种转换方式 假设json字符串为 var jsonStr='[{"Id":1,"Title":"张三","Sex":"男"},{"Id":2,"Title":"李四","Sex":"男"}]'; 假设json对象为 varjsonObj=[ { "Id":1, "Title":"张三", "Sex...
使用JQUery解析JSON字符串
09-04
在IT行业中，JavaScript库jQuery是前端开发中...以上就是关于“使用jQuery解析JSON字符串”这一主题的详细讲解，涵盖了JSON的基础知识、jQuery的解析方法以及动态更新DOM的内容。希望对您在实际项目中的应用有所帮助。
Jquery通过JSON字符串创建JSON对象
01-21
通过 JSON 字符串来创建对象 First Name: <span id=fname></span> Last Name: <span id=lname></span> [removed] //txt为字符串 var txt = '{employees:[' + '{firstName:Bill,lastName:Gates },' + '{...
Jquery针对JSON字符串处理
m0_37880556的博客
12-16 407
1:json字符串转js对象，并处理null属性值为“” var list = JSON.parse(jsonStr, function (k, v) { if (v == null) { return ""; } return v; }); 2：取json对象数据 重新处理到新的对象中（类似字典key,value格式） var listAuth=
$.each 循环json以及JSON.parse() JSON.stringify() jQuery.parseJSON()的用法:
QTFYING的博客
09-14 2796
$.each JSON.parse() JSON.stringify() jQuery.parseJSON(）
jQuery拼接json字符串和json数组（自定义Jsonp）
某某xl
10-16 5499
/** myJsonp:json数组 myJsonp1：没有复选框时用的方法，json字符串 myJsonp2：有复选框时用的方法，json字符串 myJsonp3：有复选框时和有编辑器时用的方法，json字符串 */ (function ($) { //序列化和返序列化 $.extend({ "myJsonp": function (data) {...
jquery的json对象与字符串之间转换
白不懂黑的静的专栏
03-27 312
//json对象----- >>字符串 JSON.stringify(obj) //json字符串------>>json对象 JSON.parse(string)
Ajax-JQuery处理jsonarray
༺ bestcxx的专栏 ༻
03-10 1284
问题是这样的，我在后台有一个JSONArray格式的json串，是通过前台 ajax 请求得到的，然后需要展示在页面上。 闲话少说。 1、组织数据来源     List list=生成实体类的方法，是一个list，含有许多实体类型的对象; 将list转化为jsonarray对象 JSONArray ja=JSONArray.fromObject(list);
解析并获取前端json字符串，其中包含数组
zxszj_11的博客
01-18 1927
json格式 {“name”:“1”,“fullname”:“1”,“items”: [{“name”: “1”,“fullname”: “1”},{“name”: “2”,“fullname”: “2”}]} public void test(HttpServletRequest request, HttpServletResponse response) throws IOException ...
使用Jquery解析Json基础知识
笨鸟快飞的专栏
03-21 616
前言 在WEB数据传输过程中，json是以文本，即字符串的轻量级形式传递的，而客户端一般用JS操作的是接收到的JSON对象，所以，JSON对象和JSON字符串之间的相互转换、JSON数据的解析是关键。 先明确2个概念例如： JSON字符串: var str1 = '{ "name": "deyuyi", "sex": "man" }'; JSON对象: var st
在json中JSON.parse()和JSON.stringify()及 jQuery.parseJSON( json )的理解
开发小盆友的博客
12-11 998
parse用于从一个字符串中解析出json对象,如 var str = '{"name":"xumei","age":"27"}' 结果： JSON.parse(str) Object age: "27"name: "xumei"__proto__:  Object 注意：单引号写在{}外，每个属性名都必须用双引号，否则会抛
jquery json字符串转换json对象
09-05
在jQuery中，可以使用`jQuery.parseJSON()`方法将JSON字符串转换为JSON对象。 JSON即JavaScript Object Notation，是一种轻量级的数据交换格式。它由键值对组成，使用大括号（{}）表示对象，使用方括号（[]）表示...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值