ajax如何處理服務(wù)器返回的三種數(shù)據(jù)類型
這篇文章給大家分享的是有關(guān)ajax如何處理服務(wù)器返回的三種數(shù)據(jù)類型的內(nèi)容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。
成都創(chuàng)新互聯(lián)提供高防物理服務(wù)器租用、云服務(wù)器、香港服務(wù)器、內(nèi)蒙古服務(wù)器托管等
其原理很簡單，結(jié)構(gòu)上基本不變，只是改變處理返回數(shù)據(jù)的方式.
1.Text/HTML格式
這種返回類型處理很簡單，直接就當(dāng)作字符串用就行了.為了方便使用，封裝成如下函數(shù):
/**
* @function 利用ajax動態(tài)交換數(shù)據(jù)(Text/HTML格式)
* @param url 要提交請求的頁面
* @param jsonData 要提交的數(shù)據(jù),利用Json傳遞
* @param getMsg 這個函數(shù)可以獲取到處理后的數(shù)據(jù)
*/
function ajaxText(url,jsonData,getMsg)
{
//創(chuàng)建Ajax對象,ActiveXObject兼容IE5,6
var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
//打開請求
oAjax.open('POST',url,true);//方法,URL,異步傳輸
//發(fā)送請求
var data = '';
for(var d in jsonData) //拼裝數(shù)據(jù)
data += (d + '=' +jsonData[d]+'&');
oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
oAjax.send(data);
//接收返回,當(dāng)服務(wù)器有東西返回時觸發(fā)
oAjax.onreadystatechange = function ()
{
if(oAjax.readyState == 4 && oAjax.status == 200)
{
if(getMsg) getMsg(oAjax.responseText);
}
}
}服務(wù)器端返回數(shù)據(jù)格式如下:
例如:
//返回的是xml格式
//header("Content-Type:text/xml;charset=utf-8");
//返回的是text或Json格式
header("Content-Type:text/html;charset=utf-8");
//禁用緩存,是為了數(shù)據(jù)一樣的前提下還能正常提交，而不是緩存數(shù)據(jù)
header("Cache-Control:no-cache");
$username = $_POST['username']; //獲取用戶名
if(empty($username))
echo '請輸入用戶名';
else if($username == 'acme')
echo '用戶名已被注冊';
else
echo '用戶名可用';調(diào)用格式如下:
url = 'abc.php';
var jsonData={username:'acme',passw:'acme'};
ajaxText(url,jsonData,getMsg);
function getMsg(msg)
{
//do something
}2.XML格式
返回的是一個XML DOM對象，解析其中的數(shù)據(jù)就類似于HTML DOM 編程. 比如通過name獲取標(biāo)簽對象(數(shù)組形式)，再從該數(shù)組中獲取需要的標(biāo)簽對象，再從標(biāo)簽對象中獲取文本值.
函數(shù)如下:
/**
* @function 利用ajax動態(tài)交換數(shù)據(jù)(XML格式)
* @param url 要提交請求的頁面
* @param jsonData 要提交的數(shù)據(jù),利用Json傳遞
* @param tagName 要獲取值的標(biāo)簽名
* @param getMsg 這個函數(shù)可以獲取到處理后的數(shù)據(jù)
*/
function ajaxXML(url,jsonData,tagName,getMsg)
{
//創(chuàng)建Ajax對象,ActiveXObject兼容IE5,6
var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
//打開請求
oAjax.open('POST',url,true);//方法,URL,異步傳輸
//發(fā)送請求
var data = '';
for(var d in jsonData) //拼裝數(shù)據(jù)
data += (d + '=' +jsonData[d] + '&');
oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
oAjax.send(data);
//接收返回,當(dāng)服務(wù)器有東西返回時觸發(fā)
oAjax.onreadystatechange = function ()
{
if(oAjax.readyState == 4 && oAjax.status == 200)
{
var oXml = oAjax.responseXML; //返回的是一個XML DOM對象
var oTag = oXml.getElementsByTagName(tagName);
var tagValue = oTag[0].childNodes[0].nodeValue;
if(getMsg)getMsg(tagValue);
}
}
}服務(wù)器端返回數(shù)據(jù)格式如下:
例如:
//返回的是xml格式
header("Content-Type:text/xml;charset=utf-8");
//返回的是text或Json格式
//header("Content-Type:text/html;charset=utf-8");
//禁用緩存,是為了數(shù)據(jù)一樣的前提下還能正常提交，而不是緩存數(shù)據(jù)
header("Cache-Control:no-cache");
$username = $_POST['username']; //獲取用戶名
if(empty($username))
echo '<user><mes>請輸入用戶名</mes></user>'; //這些標(biāo)簽可以自定義
else if($username == 'acme')
echo '<user><mes>用戶名已被注冊</mes></user>';
else
echo '<user><mes>用戶名可用</mes></user>';調(diào)用格式如下:
var url = 'abc.php';
var jsonData = {username:'acme'};
ajaxXML(url,jsonData,'mes',getMsg);
function getMsg(msg)
{
//do something
}3.返回json
函數(shù)如下：
/**
* @function 利用ajax動態(tài)交換數(shù)據(jù)(Text/HTML格式)，但是返回的是Json類型的文本數(shù)據(jù)
* @param url 要提交請求的頁面
* @param jsonData 要提交的數(shù)據(jù),利用Json傳遞
* @param getMsg 這個函數(shù)可以獲取到處理后的數(shù)據(jù)
*/
function ajaxJson(url,jsonData,getMsg)
{
//創(chuàng)建Ajax對象,ActiveXObject兼容IE5,6
var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
//打開請求
oAjax.open('POST',url,true);//方法,URL,異步傳輸
//發(fā)送請求
var data = '';
for(var d in jsonData) //拼裝數(shù)據(jù)
data += (d + '=' +jsonData[d] + '&');
oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
oAjax.send(data);
//接收返回,當(dāng)服務(wù)器有東西返回時觸發(fā)
oAjax.onreadystatechange = function ()
{
if(oAjax.readyState == 4 && oAjax.status == 200)
{
var json = eval('('+oAjax.responseText+')');//把傳回來的字符串解析成json對象
if(getMsg)getMsg(json);
}
}
}服務(wù)器端返回數(shù)據(jù)格式如下:
例如:
//返回的是xml格式
//header("Content-Type:text/xml;charset=utf-8");
//返回的是text或Json格式
header("Content-Type:text/html;charset=utf-8");
//禁用緩存,是為了數(shù)據(jù)一樣的前提下還能正常提交，而不是緩存數(shù)據(jù)
header("Cache-Control:no-cache");
$username = $_POST['username']; //獲取用戶名
if(empty($username))
echo '{"mes":"請輸入用戶名"}';
else if($username == 'acme')
echo '{"mes":"用戶名已被注冊"}';
else
echo '{"mes":"用戶名可用"}';調(diào)用格式如下:
url = 'abc.php';
var jsonData={username:'acme',passw:'acme'};
ajaxText(url,jsonData,getMsg);
function getMsg(msg)
{
//do something
}為了方便使用，可以把三個函數(shù)合并.合并后的函數(shù)如下:
/**
* @function 利用ajax動態(tài)交換數(shù)據(jù)
* @param url 要提交請求的頁面
* @param jsonData 要提交的數(shù)據(jù),利用Json傳遞
* @param getMsg 這個函數(shù)可以獲取到處理后的數(shù)據(jù)
* @param type 接受的數(shù)據(jù)類型,text/xml/json
* @param tagName type = xml 的時候這個參數(shù)設(shè)置為要獲取的文本的標(biāo)簽名
* @return 無
*/
function ajax(url,jsonData,getMsg,type,tagName)
{
//創(chuàng)建Ajax對象,ActiveXObject兼容IE5,6
var oAjax = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
//打開請求
oAjax.open('POST',url,true);//方法,URL,異步傳輸
//發(fā)送請求
var data = '';
for(var d in jsonData) //拼裝數(shù)據(jù)
data += (d + '=' +jsonData[d]+'&');
oAjax.setRequestHeader("Content-type","application/x-www-form-urlencoded");
oAjax.send(data);
//接收返回,當(dāng)服務(wù)器有東西返回時觸發(fā)
oAjax.onreadystatechange = function ()
{
if(oAjax.readyState == 4 && oAjax.status == 200)
{
if(type == 'text')
{
if(getMsg) getMsg(oAjax.responseText);
}
else if(type == 'json')
{
var json = eval('('+oAjax.responseText+')');//把傳回來的字符串解析成json對象
if(getMsg)getMsg(json);
}
else if(type == 'xml')
{
var oXml = oAjax.responseXML; //返回的是一個XML DOM對象
var oTag = oXml.getElementsByTagName(tagName);
var tagValue = oTag[0].childNodes[0].nodeValue;
if(getMsg)getMsg(tagValue);
}
}
}
}感謝各位的閱讀！關(guān)于“ajax如何處理服務(wù)器返回的三種數(shù)據(jù)類型”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，讓大家可以學(xué)到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！
分享名稱：ajax如何處理服務(wù)器返回的三種數(shù)據(jù)類型
本文來源：http://muchs.cn/article12/gddggc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設(shè)計公司、網(wǎng)站內(nèi)鏈、用戶體驗、網(wǎng)站改版、做網(wǎng)站、商城網(wǎng)站
聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)
- app軟件定制開發(fā)的優(yōu)勢 2023-03-25
- 小程序定制開發(fā)必看！你的小程序定制了嗎？ 2021-03-01
- APP開發(fā)，只能選擇定制開發(fā)！ 2022-11-18
- 通州網(wǎng)站建設(shè)中的模板網(wǎng)站與定制開發(fā)區(qū)別 2023-03-21
- 企業(yè)網(wǎng)站建站模板網(wǎng)站建設(shè)和網(wǎng)站定制開發(fā)企業(yè)公司應(yīng)該怎么選？ 2023-02-21
- 母嬰商城成都網(wǎng)站建設(shè)站定制開發(fā) 2016-11-14
- 網(wǎng)站制作公司定制開發(fā)網(wǎng)站的好處是什么 2016-09-09
- 定制開發(fā)的網(wǎng)站都有什么樣的好處 2016-10-27
- 六盤水網(wǎng)站建設(shè)-高端企業(yè)網(wǎng)站定制開發(fā)報價及seo推廣公司 2023-02-21
- 北京軟件定制開發(fā)服務(wù)流程介紹 2023-03-15
- 做網(wǎng)站為什么要找網(wǎng)站建設(shè)定制開發(fā)公司 2021-05-08
- 定制開發(fā)企業(yè)網(wǎng)站的特點有哪些 2021-03-28