`

javascript 操作 JSON

阅读更多
JSON (JavaScript Object Notation)一种简单的数据格式,比xml更轻巧。 JSON 是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。
JSON的规则很简单: 对象是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔。具体细节参考http://www.json.org/json-zh.html
举个简单的例子:
js 代码
1. function showJSON() {   
2.     var user =    
3.     {    
4.         "username":"andy",   
5.         "age":20,   
6.         "info": { "tel": "123456", "cellphone": "98765"},   
7.         "address":   
8.             [   
9.                 {"city":"beijing","postcode":"222333"},   
10.                 {"city":"newyork","postcode":"555666"}   
11.             ]   
12.     }   
13.        
14.     alert(user.username);   
15.     alert(user.age);   
16.     alert(user.info.cellphone);   
17.     alert(user.address[0].city);   
18.     alert(user.address[0].postcode);   
19. }   
这表示一个user对象,拥有username, age, info, address 等属性。
同样也可以用JSON来简单的修改数据,修改上面的例子
js 代码
1. function showJSON() {   
2.     var user =    
3.     {    
4.         "username":"andy",   
5.         "age":20,   
6.         "info": { "tel": "123456", "cellphone": "98765"},   
7.         "address":   
8.             [   
9.                 {"city":"beijing","postcode":"222333"},   
10.                 {"city":"newyork","postcode":"555666"}   
11.             ]   
12.     }   
13.        
14.     alert(user.username);   
15.     alert(user.age);   
16.     alert(user.info.cellphone);   
17.     alert(user.address[0].city);   
18.     alert(user.address[0].postcode);   
19.        
20.     user.username = "Tom";   
21.     alert(user.username);   
22. }   
JSON提供了json.js包,下载http://www.json.org/json.js 后,将其引入然后就可以简单的使用object.toJSONString()转换成JSON数据。
js 代码
1. function showCar() {   
2.     var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");   
3.     alert(carr.toJSONString());   
4. }   
5.   
6. function Car(make, model, year, color)       {   
7.      this.make  =  make;   
8.      this.model  =  model;   
9.      this.year  =  year;   
10.      this.color  =  color;   
11. }   
可以使用eval来转换JSON字符到Object
js 代码
1. function myEval() {   
2.     var str = '{ "name": "Violet", "occupation": "character" }';   
3.     var obj = eval('(' + str + ')');   
4.     alert(obj.toJSONString());   
5. }   
或者使用parseJSON()方法
js 代码
1. function myEval() {   
2.     var str = '{ "name": "Violet", "occupation": "character" }';   
3.     var obj = str.parseJSON();   
4.     alert(obj.toJSONString());   
5. }   
下面使用prototype写一个JSON的ajax例子。
先写一个servlet (我的是servlet.ajax.JSONTest1.java)就写一句话
java 代码
1. response.getWriter().print("{ \"name\": \"Violet\", \"occupation\": \"character\" }");  
再在页面中写一个ajax的请求
js 代码
1. function sendRequest() {   
2.     var url = "/MyWebApp/JSONTest1";   
3.     var mailAjax = new Ajax.Request(   
4.         url,   
5.         {   
6.             method: 'get',   
7.             onComplete: jsonResponse   
8.         }   
9.     );   
10. }   
11.   
12. function jsonResponse(originalRequest) {   
13.     alert(originalRequest.responseText);   
14.     var myobj = originalRequest.responseText.parseJSON();   
15.     alert(myobj.name);   
16. }   
prototype-1.5.1.js中提供了JSON的方法,String.evalJSON(), 可以不使用json.js, 修改上面的方法
js 代码
1. function jsonResponse(originalRequest) {   
2.     alert(originalRequest.responseText);   
3.     var myobj = originalRequest.responseText.evalJSON(true);   
4.     alert(myobj.name);   
5. }   
JSON还提供了java的jar包 http://www.json.org/java/index.html API也很简单,下面举个例子
在javascript中填加请求参数
js 代码
1. function sendRequest() {   
2.     var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");   
3.     var pars = "car=" + carr.toJSONString();   
4.   
5.     var url = "/MyWebApp/JSONTest1";   
6.     var mailAjax = new Ajax.Request(   
7.         url,   
8.         {   
9.             method: 'get',   
10.             parameters: pars,   
11.             onComplete: jsonResponse   
12.         }   
13.     );   
14. }   
使用JSON请求字符串就可以简单的生成JSONObject并进行解析,修改servlet添加JSON的处理(要使用json.jar)
java 代码
1. private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {   
2.         String s3 = request.getParameter("car");   
3.         try {   
4.             JSONObject jsonObj = new JSONObject(s3);   
5.             System.out.println(jsonObj.getString("model"));   
6.             System.out.println(jsonObj.getInt("year"));   
7.         } catch (JSONException e) {   
8.             e.printStackTrace();   
9.         }   
10.         response.getWriter().print("{ \"name\": \"Violet\", \"occupation\": \"character\" }");   
11.     }   
同样可以使用JSONObject生成JSON字符串,修改servlet
java 代码
1. private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {   
2.         String s3 = request.getParameter("car");   
3.         try {   
4.             JSONObject jsonObj = new JSONObject(s3);   
5.             System.out.println(jsonObj.getString("model"));   
6.             System.out.println(jsonObj.getInt("year"));   
7.         } catch (JSONException e) {   
8.             e.printStackTrace();   
9.         }   
10.            
11.         JSONObject resultJSON = new JSONObject();   
12.         try {   
13.             resultJSON.append("name", "Violet")   
14.                       .append("occupation", "developer")   
15.                       .append("age", new Integer(22));   
16.             System.out.println(resultJSON.toString());   
17.         } catch (JSONException e) {   
18.             e.printStackTrace();   
19.         }   
20.         response.getWriter().print(resultJSON.toString());   
21.     }   
js 代码
1. function jsonResponse(originalRequest) {   
2.     alert(originalRequest.responseText);   
3.     var myobj = originalRequest.responseText.evalJSON(true);   
4.     alert(myobj.name);   
5.     alert(myobj.age);   
6. }  

分享到:
评论

相关推荐

    使用JavaScript操作JSON源码

    在JavaScript中操作JSON源码是常见的任务,尤其在与服务器进行数据交互时。本篇将深入探讨如何使用JavaScript来操作JSON源码。 首先,理解JSON的基本结构至关重要。JSON基于JavaScript对象语法,但不包含函数和一些...

    javascript操作JSON的要领总结

    JSON,全称JavaScript Object Notation,是一种轻量级的数据交换格式。它以纯文本形式存在,独立于语言,但设计时特别考虑到JavaScript的语法。在JavaScript中,JSON被视为原生格式,无需额外的库或API就能进行解析...

    JavaScript and JSON Essentials

    随着互联网的兴起,数据在网络上交换的方式经历了...总的来说,《JavaScript与JSON实用指南》将帮助开发者掌握JSON的核心知识,并了解如何使用JavaScript创建和处理JSON数据,从而构建出更加高效和功能丰富的web应用。

    在Javascript操作JSON对象,增加 删除 修改的简单实现

    在Javascript操作JSON对象,增加删除修改全有的,详情见代码 [removed] var jsonObj2 = { teacher: [ { name: "jordan", sex: "m", age: "40" }, { name: "bryant", sex: "m", age: "28" }, { name: "McGrady",...

    jsoneditor_javascript_JSON_jsoneditor9.1.4_json-editorjs_

    在JSONEditor的背景下,JavaScript负责实现所有用户界面的动态交互和JSON数据的操作。开发者可以利用JSONEditor的API和事件处理机制来定制编辑器的行为,例如添加验证规则、监听数据变化等。 JSONEditor的核心特性...

    js操作json

    JavaScript 操作 JSON JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,基于 JavaScript 的一个子集。它可以表示数字、字符串、逻辑值、数组、对象、函数、空字符串和 null 等多种数据类型。 在 ...

    javascript处理json字符串和json对象的类(含示例)

    在JavaScript中,JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它基于JavaScript的一个子集,易于人阅读和编写,同时也易于机器解析和生成。处理JSON数据是Web开发中的常见任务,尤其是在与...

    JavaScript程序设计-JS中的JSON对象.pdf

    5. 使用JavaScript操作JSON - 在JavaScript中,我们可以使用`JSON.parse()`将JSON字符串转换为JavaScript对象,例如: ```javascript var jsonString = '{"name": "pingan"}'; var jsonObject = JSON.parse(json...

    JavaScript的json封装

    因项目需求,自己拼接麻烦,所以将javascript拼接json封装成和java类似的操作,直接put() 与 get() 就可以使用,支持json数组,使用的时候只需要 创建对象 并赋值 然后调用内部参数即可,源码中有示例。因为删除操作...

    纯javascript实现json与对象的互相转换项目

    本项目专注于纯JavaScript实现JSON(JavaScript Object Notation)与JavaScript对象之间的互相转换,这对于数据的存储、传输以及序列化至关重要。JSON作为一种轻量级的数据交换格式,因其易读易写、机器可读性高而被...

    delphi7_ remobject_javascript_json

    SuperObject提供了一种直观的方式来创建和操作JSON对象,它的API与JavaScript的JSON对象类似。 总结来说,"delphi7_remoject_javascript_json"实例展示了如何在Delphi 7环境中结合RemObjects JavaScript库和JSON...

    C#,AJAX读写JSON

    总的来说,这个项目涉及到的知识点包括C#编程、JSON序列化和反序列化、AJAX技术、JavaScript操作JSON、ASP.NET Web开发以及资源文件的使用。这些技能在现代Web开发中是非常重要的,能够帮助开发者构建响应式、高性能...

    xmlhttp+asp+javascript+xml+json

    在压缩包"xmlhttp+asp+javascript+xml+json"中,可能包含了示例代码或者教程,展示了如何在ASP环境中使用XMLHTTP对象与服务器通信,JavaScript处理JSON或XML响应,并在客户端进行数据操作。如果你正面临一个需要使用...

    json的前台操作和后台操作实现代码.docx

    这段代码展示了如何通过JavaScript操作JSON数据并显示在网页上: ```javascript var txt = '{"employees":[' + '{"firstName":"Bill","lastName":"Gates" },' + '{"firstName":"George","lastName":"Bush" },' + ...

    javascript object to json string

    JavaScript对象转换为JSON字符串是Web开发中的常见操作,特别是在数据交换和存储时。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它基于JavaScript的一个子集,易于人阅读和编写,同时也易于...

    解决javascript组装json的繁琐问题

    在JavaScript开发中,数据交换通常涉及JSON(JavaScript Object Notation)格式,因为它轻量级、易于阅读和编写,同时也被广泛支持。然而,处理JSON的组装过程可能会变得繁琐,尤其是在需要构建复杂的数据结构时。本...

    javascript读取json数组生成滚动分页

    在JavaScript中,JSON对象可以被解析为JavaScript原生对象,便于我们操作和处理。 1. **解析JSON数据**: 当从服务器获取数据时,数据通常以JSON格式返回。我们可以使用`JSON.parse()`方法将JSON字符串转换为...

    页面json展示

    3. **JavaScript操作JSON**:使用JavaScript内置的`JSON.parse()`方法解析JSON字符串为JavaScript对象,以及如何遍历和操作这些对象。 4. **DOM操作**:利用JavaScript修改HTML元素,将JSON数据展示在网页上,可能...

Global site tag (gtag.js) - Google Analytics