Ajax返回的3个类型

使用Ajax异步返回的两种类型

Ajax = 异步 JavaScript 和 XML,Ajax 是一种用于创建快速动态网页的技术,通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新,传统的网页(不使用 Ajax)如果需要更新内容,必需重载整个网页面。看下图
在这里插入图片描述

传统的Ajax写法:
/**
 * @function 利用ajax动态交换数据(Text/HTML格式)
 * @param url   要提交请求的页面
 * @param jsonData  要提交的数据,利用Json传递
 * @param getMsg  这个函数可以获取到处理后的数据
 */
function ajax_demo(url,jsonData,getMsg)
{
    //创建Ajax对象,ActiveXObject兼容IE5,6
    var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
    //打开请求
    oAjax.open('POST',url,true);//方法,URL,异步传输
    //发送请求
    var data = '';//拼装数据
    oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    oAjax.send(data);
    //接收返回,当服务器有东西返回时触发
    oAjax.onreadystatechange = function () {
        if(oAjax.readyState == 4 && oAjax.status == 200){
            var text = oAjax.responseText;
            //处理数据
        }
    }
}
使用jQuery使用:
function ajax_demo() {
        var form_data = '';
        $.ajax({
            type:'POST',
            url:'upload.do',
            data:form_data,
            cache : false,
            processData : false,
            contentType : false,
        }).success(function (data) {
            var result = JSON.parse(data);
            alert(result.back());
        }).error(function () {
            alert("上传失败!")
        });
    }

后端返回前端的3种类型

1、返回html(jsp)格式的数据,后端处理完后,直接返回一个页面。前端直接将的到HTML添加到页面就行了,

2、返回xml格式的数据

3、返回json格式的数据

解析HTML

HTML由一些普通的文本组成,如果服务器通过XMLHttpRequest对象来发送HTML,文本将存储在ResponseText属性中。不必从ResponseText属性中读取数据,因为它本身就是希望的数据格式,可以直接将它插入页面中。
插入HTML代码最简单的方法是更新这个元素的innerHTML属性。
优点:
(1)从服务器端发送的HTML代码在浏览器端不需要用JavaScript进行解析;
(2)HTML的可读性好。
(3)HTML代码与innerHTML属性搭配,效率高。
缺点:
(1)若需要通过Ajax更新一篇文档的多个部分,HTML不合适(2)innerHTML并非DOM标准。

解析XML
优点:

1)XML是一种通用的数据格式。
2)不必把数据强加到已定义好的格式中,而是要为数据自定义合适的标记。
3)利用DOM可以完全掌控文档。

缺点:

1)如果文档来自于服务器,就必须保证文档含有正确的首部信息,若文档类型不正确,那么requestXML属性将是空的。2)当浏览器接收到长的XML文件后,DOM解析可能会很复杂。

解析JSON

JSON是一种简单的数据格式,比XML更加轻巧。JSON 是JavaScript原生格式,这意味着在javascript中处理JSON数据不需要任何特殊的API或者工具包。JSON的规则很简单:对象是一个无序的 “名称/值”对集合,一个对象以“{”(左括号)开始,以“}”(右括号)结束,每一个名称后面跟一个“:”(冒号),名称/值之间用逗号分隔开。JSON用冒号而不是等号来赋值。每一条赋值语句用逗号分开。整个对象用大括号封装起来,可用大括号分级嵌套数据。对象描述中存储的数据可以是字符串,数字或布尔值,对象描述也可存储函数,即对象的方法。JSON只是一种文本字符串,它被存储在responseText属性中。为了读取存储在responseText属性中的JSON数据,需要用到javascript的eval()语句,eval函数会把一个字符串当做它的一个参数,然后这个字符串会被当做javascript代码来执行,因为JSON的字符串就是javascript代码构成的,所以它本身是可以执行的。JSON提供了json.js包后,使用parseJSON()方法可以将JSON对象解析为js对象。

优点:

(1)作为一种数据传输格式,JSON与XML很相似,但是它更加灵巧。
(2)JSON不需要从服务器端发送含有特定内容类型的首部信息。

缺点:

(1)语法过于严谨。
(2)代码不易读。
(3)eval函数存在风险。

注意:若从服务器端返回json字符串,则属性名必须使用双引号(需要转义),不能使用单引号。
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值