JavaScript 中處理 JSON 資料

Json全名：JavaScriprt  Objet Notation  是一種簡單的資料格式比XML更輕巧..Json是JavaScript 的原生格式...是以在JavaScript中處理Json資料不需要任何特殊的API及JAR...

Json規則：對象是一個無序的 " ' 名稱/值 ' 對  "  集合，一個對象以 " {"  ( 左括号)開始"}" (右括号) 結束。每個 " 名稱 " 後跟一個 " : "( 冒号) ;   "  '名稱/值 ' 對  "  之間使用  "  ,  "（逗号）分隔。

Examples:

       1.  function showJSON() {                     var user =   {                              "username":"qinrw",                              "age":24,                              "info": { "tel": "188029xxxxx", "cellphone" :  "98765"},                              "address":    [                                                          {"city":"陝西","postcode" : "0823"},                                                           {"city":"北京","postcode" :" 0823"}                                                      ]                                           }                        alert(user.username);                        alert(user.age);                        alert(user.info.cellphone);                        alert(user.address[0].city);                        alert(user.address[0].postcode);                                        }  

           2.JSON來簡單的修改資料

                function showJSON() {    

                     var user =   {                   

                                "username":"qinrw",    

                               "age":24,    

                               "info": { "tel": "123456", "cellphone": "98765"},    

                               "address":   [                              

                                          {"city":"陝西","postcode":"0823"},     

                                          {"city":"北京","postcode":"0823"}    

                                        ]    

                                }   

                      alert(user.username);     

                      alert(user.age);    

                      alert(user.info.cellphone);    

                      alert(user.address[0].city);    

                      alert(user.address[0].postcode);   

                      user.username = "imqinrw";    

                      alert(user.username);        

                   }  

           3.JSON提供了json.js包，下載下傳http://www.json.org/json.js後，将其引入然後就可以簡單的使用object.toJSONString()轉換成JSON資料。

                 function showCar() {    

                      var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");    

                      alert(carr.toJSONString());    

                        }   

                 function Car(make, model, year, color)   {    

                     this.make   =   make;    

                     this.model   =   model;    

                     this.year   =   year;    

                     this.color   =   color;    

                         }

             使用eval來轉換JSON字元到Object

                  function myEval() {    

                        var str = '{ "name": "Violet", "occupation": "character" }';    

                        var obj = eval('(' + str + ')');    

                        alert(obj.toJSONString());                    

                       }

            或者使用parseJSON()方法

                  function myEval() {    

                        var str = '{ "name": "Violet", "occupation": "character" }';    

                        var obj = str.parseJSON();    

                        alert(obj.toJSONString());     

                  }

             JSON還提供了java的jar包 http://www.json.org/java/index.html API也很簡單，下面舉個例子

              *在javascript中填加請求參數

               js 代碼

               function sendRequest() {    

                   var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");    

                   var pars = "car=" + carr.toJSONString();   

                   var url = "/MyWebApp/JSONTest1";    

                   var mailAjax = new Ajax.Request(    

                          url,    

                           {     

                               method: 'get',    

                               parameters: pars,       

                                 onComplete: jsonResponse     

                           }     

                      );    

                  }   

            使用JSON請求字元串就可以簡單的生成JSONObject并進行解析,修改servlet添加JSON的處理(要使用json.jar)

           java 代碼

          private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {    

            String s3 = request.getParameter("car");     

            try {    

               JSONObject jsonObj = new JSONObject(s3);    

               System.out.println(jsonObj.getString("model"));     

               System.out.println(jsonObj.getInt("year"));     

                   } catch (JSONException e) {      

                         e.printStackTrace();       

                      }     

                response.getWriter().print("{ /"name/": /"Violet/", /"occupation/": /"character/" }");    

            }  

         同樣可以使用JSONObject生成JSON字元串，修改servlet

          java 代碼

          private void doService(HttpServletRequest request, HttpServletResponse response) throws IOException {    

             String s3 = request.getParameter("car");     

             try {    

                JSONObject jsonObj = new JSONObject(s3);    

                System.out.println(jsonObj.getString("model"));     

                System.out.println(jsonObj.getInt("year"));        

                  } catch (JSONException e) {    

                         e.printStackTrace();    

                 }     

               JSONObject resultJSON = new JSONObject();    

                   try {    

                        resultJSON.append("name", "Violet")   

                       .append("occupation", "developer")   

                       .append("age", new Integer(22));    

                        System.out.println(resultJSON.toString());     

                       } catch (JSONException e) {    

                    e.printStackTrace();     

                    }     

                      response.getWriter().print(resultJSON.toString());     

                   }   

             js 代碼

              function jsonResponse(originalRequest) {    

                     alert(originalRequest.responseText);    

                     var myobj = originalRequest.responseText.evalJSON(true);    

                     alert(myobj.name);    

                     alert(myobj.age);     

                }