html 文件<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax test</title>
<script src="js/ajax.js"></script>
<script src="js/base.js"></script>
<script type="text/javascript">
var ajax=new ajax();
function send(){
/*var str=ajax.get("deal.php?name=zhangsan&age=22"+Math.random(),"text",function (data){
alert($("show"));
$("show").innerHTML=data;
});*/
/*ajax.post("deal.php","xml","name=zhangsan&age=13&sex=nan",function (obj){
var htmlobj=obj.getElementsByTagName('name')[0];
alert(htmlobj.childNodes[0].nodeValue);
$("show").innerHTML=htmlobj.childNodes[0].nodeValue+"<br />";
while(htmlobj.nextSibling.nodeType===1){
var i=0;
while(i<htmlobj.nextSibling.childNodes.length){
$("show").innerHTML+=htmlobj.nextSibling.childNodes[i].textContent+"<br />";
i++;
}
htmlobj=htmlobj.nextSibling;
}*/
var str=ajax.get("deal.php?name=zhangsan&age=22"+Math.random(),"json",function (data){
var str='';
for (var i in data)
{
if(i=="introduce")
{
for (var j in data[i]){
str += j + '=>' + data[i][j] + '<br />';
j++;
}
}
else{
str += i + '=>' + data[i] + '<br />';
}
i++;
}
$("show").innerHTML=str;
});
}
</script>
</head>
<body>
<button name="aaa" onclick="send()">點我試試！</button>
<div id="show">
</div>
</body>
</html>
ajax.js 文件<pre name="code" class="javascript">function ajax(){
var _this=this;
this.xhr='';
this.contenttype='';
this.get=function (url,contenttype,fun){
_this.contenttype=contenttype;
_this.xhr=createajax();
_this.fun=fun;
_this.xhr.onreadystatechange=chuli;
_this.xhr.open("get",url,true);
_this.xhr.send(null);
return _this.data;
};
this.post=function (url,contenttype,data,fun){
_this.xhr=createajax();
_this.contenttype=contenttype;
_this.fun=fun;
_this.xhr.onreadystatechange=chuli;
_this.xhr.open("post",url,true);
_this.xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
_this.xhr.send(data);
};
function createajax(){
if(XMLHttpRequest){
return new XMLHttpRequest();
}
if(ActiveXObject){
return new ActiveXObject("microsoft.XMLHTTP");
}
}
function chuli(){
if(_this.xhr.readyState===4&&_this.xhr.status==200){
if(_this.contenttype=="xml"){
alert(_this.xhr.responseXML);
_this.fun(_this.xhr.responseXML);
}
else if(_this.contenttype=="json"){
var obj='';
eval("obj="+_this.xhr.responseText);
alert(typeof(obj));
//if(typeof(obj)=="object")
_this.fun(obj);
//_this.fun(false);
}
else
_this.fun(_this.xhr.responseText);
}
}
}base.js 文件
<pre name="code" class="javascript">function $(str){
var htmlobj=document.getElementById(str);
return htmlobj;
}deal.php 文件
<pre name="code" class="php"><?php
//header("Content-Type:text/xml;charset=utf-8");
header("Content-Type:text/html;charset=utf-8");
header("Cache-Control:no-cache");
//echo $str;
/*$file=fopen("save.txt", "a");
fwrite($file, $str);
fclose($file);*/
/*echo "<?xml version='1.0' encoding='UTF-8'?>" .
"<root>" .
"<name>xxxx</name>" .
"<sex>男</sex>" .
"<introduce>" .
"<msgone>單身,求交往!</msgone>" .
"<msgtwo>請叫我,碼農!程序猿!</msgtwo>" .
"</introduce>" .
"</root>";*/
echo '{
"name":"張珊",
"age":"29",
"sex":"男",
"introduce":{
"msgone":"單身,求交往!",
"msgtwo":"請叫我,碼農!程序猿!"
}
}';
?>