JSON的一些转换和技巧

最新推荐文章于 2023-08-02 17:37:38 发布

Impl_Sunny

最新推荐文章于 2023-08-02 17:37:38 发布

阅读量662

点赞数

本文链接：https://blog.csdn.net/u011487470/article/details/40864731

版权

JSON的小知识

JSON: JavaScript Object Notation(JavaScript 对象表示法)

JSON 是存储和交换文本信息的语法。类似 XML。

JSON 比 XML 更小、更快，更易解析。

JSON 实例:可以通过"在线JSON校验的网站"进行校验

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}

JSON的数据结构

json简单说就是javascript中的对象和数组，所以这两种结构就是对象和数组两种结构，通过这两种结构可以表示各种复杂的结构

1、对象：对象在js中表示为“{}”括起来的内容，数据结构为 {key：value,key：value,...}的键值对的结构，在面向对象的语言中，key为对象的属性，value为对应的属性值，所以很容易理解，取值方法为对象.key 获取属性值，这个属性值的类型可以是数字、字符串、数组、对象几种。

2、数组：数组在js中是中括号“[]”括起来的内容，数据结构为 ["java","javascript","vb",...]，取值方式和所有语言中一样，使用索引获取，字段值的类型可以是数字、字符串、数组、对象几种。

经过对象、数组2种结构就可以组合成复杂的数据结构了。

如何获取JSON的数组：jQuery.serializeArray()

详情请参考：http://www.365mini.com/page/jquery-serialize.htm

serializeArray()函数用于序列化一组表单元素，将表单内容编码为一个JavaScript数组。

注意：

与常规表单提交不一样的是：常规表单一般会提交带有name的按钮控件，而serializeArray()函数不会序列化带有name的按钮控件。

示例：

<form name="myForm" action="http://www.365mini.com" method="post">
    <input name="uid" type="hidden" value="1" />
    <input name="username" type="text" value="张三" />
    <input name="password" type="text" value="123456" />
    <select name="grade" id="grade">
        <option value="1">一年级</option>
        <option value="2">二年级</option>
        <option value="3" selected="selected">三年级</option>
        <option value="4">四年级</option>
        <option value="5">五年级</option>
        <option value="6">六年级</option>
    </select>
    <input name="sex" type="radio" checked="checked" value="1" />男
    <input name="sex" type="radio" value="0" />女
    <input name="hobby" type="checkbox" checked="checked" value="1" />游泳
    <input name="hobby" type="checkbox" checked="checked" value="2" />跑步
    <input name="hobby" type="checkbox" value="3" />羽毛球
    <input name="btn" id="btn" type="button" value="点击" />
</form>

对<form>元素进行序列化可以直接序列化其内部的所有表单元素：

var formArray = $("form").serializeArray();
/* 以下是序列化后的结果数组formArray的内容：
[
    { name: "uid", value: "1" },
    { name: "username", value: "张三" },
    { name: "password", value: "123456" },
    { name: "grade", value: "3" },
    { name: "sex", value: "1" },
    { name: "hobby", value: "1" },
    { name: "hobby", value: "2" }
];
*/

JavaScript JSON与String互转

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> JSON 测试 </title>

  <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"> </script>
 </head>

 <body>
  
  <script> 
	//建立一个简单的Json对象
	var testJsonObj = {"name":"lilao", "email":"xx@qq.com"};	
	alert("JSON OBJ:" + testJsonObj);

	//将Json对象直接转换成字符串
	var testJsonString = JSON.stringify(testJsonObj);
	alert("JSON String:"+ testJsonString); 

	
	//将字符串转换成Json对象,使用了Jquery函数
	alert(jQuery.parseJSON(testJsonString));
	alert(jQuery.parseJSON(testJsonString).name);  
  </script>
 </body>
</html>