JSON与AJAX数据Web之无刷新处理

来源:互联网 发布:驱动人生mac版下载 编辑:程序博客网 时间:2024/03/29 18:21
 

          在现在Web的开发中,界面友好和性能越来越成为一个网页的好坏的评判标准,对于实现界面无刷新(局部刷新)请求和简单传输数据与服务器交互,我想来谈谈一下技术 

          这篇博文是我对Ajax和Json的总结,在这里讲解了基本运用和简介,大家通过这些学习可以结合开发运用到实战当中去

 

             AJAX(asynchronous Javascript XML)异步的javascript与xml

             核心对象 :XMLHttpRequest 对象

             Ajax准备向服务器发送请求:xmlHttpRequest.open("get(提交)","url",true(是否是异步提交))

              Different with firefox:

                        IE中如果设置了xmlHttpRequest.send("get","url",false);//当第三个参数为false时,那么在浏览器上实现的是同步

                        Firefox中如果第三个参数为false时,不会调用回调函数,注册根本就不会调用,也就是firefox不会执行false的同步操作

 

         base program:

                 var req;

                    function createXmlHttpRequest(){

                            if(window.ActionXObject){//  IE browse

                                      req=new ActionXObject("MicrosoftXMLHTTP");                 

                             }

                              else{//firefox等其他浏览器

                                       req=new XMLHttpRequest();

                              }

                      }      

//send ajax message request to server    发送ajax消息请求给服务器

              function ajaxSend(url,getMsg){

                         //解决IE中如果URL提交地址不改变,IE不会对用户操作进行请求提交的处理

                         url=url+"&"+Math.random();

                         //解决中文地址乱码问题

                         url=windowm.encodeURI(url);

                          //需要进行两次转码

                          url=window.encodeURI(url);

                          //create ajax kernel object   创建ajax核心对象

                          createHttpRequest();

                          //ajax call-back function   回调函数

                            req.onreadystatechange=function(){

                                        if(req.readystate==4){//准备完成

                                                  if(req.status==200){

                                                            //回调处理

                                                             var s=req.responseText();

                                                               getMsg(s);     

                                                    }

                                         }

                              }

            }

          req.open("get",url,true/false);  //true synchronize        false  asynchronous

          req.send(null);//可以发送消息数据,也可以为null

 

---------------------JSON

               JSON:javascript Object notation(标记法)

               json是一种轻量级的数据交换格式,json采用了完全独立于语言的文本格式

        基本结构:名称/值   对的集合

                         值的有序列表,大部分语言中称为array数组

   Json名/值的表示

              example:名/值

                   {"sharme",:"123yao"} //注意实际上这里比等效的村文本占用更多的空间

               var  sharme={"sharneName":"sharmeYao","sharmePwd":"123yao"};

               var name=sharme.sharmeName;//获取值

               

                 example:array

                        String str=["person1":{"name":"sharme","sex":"man'},"person2":{"name":"jdss","sex":"man"}];//通过"  , "逗号来区别每一个数组对象

数据快速访问:   str[0].name    通过这种简单的方式对json数据格式进行访问

修改数据同样简单:  str[0].sex="woman"

 

                JSON文本数据和对象的转换

                       将对象转换为JSON文本数据

                       String jsonString=people.toJSONString();

                        注意:可以将任何javascript中的对象转换为json文本数据

         数据注意:数组是值的有序集合,一个数组以“'[”(左中括号)开始,“]”(右中括号)结束,值之间使用“,”(逗号)分隔

           值类型可以使:string /  number  /true  /false  /null /对象 或者数组,并且这些都可以进行嵌套

 

  对于AJAX和JSON的讨论就到这里把,当然我相信这些仅仅是基于AJAX和JSON的讲解,对于AJAX和JSON的深度分析我会在下次和大家再进行讨论