实现Ajax请求的代码于前面的基于XML格式的代码基本类似，我们只需要修改一下获取字符串的方式和遍历的代码即可。完整的代码如下：

<script type="text/javascript">   window.onload = init;   function init(){     document.getElementById("btn").onclick = getPerson;   }   function getPerson(){     //1、获取XMLHttpRequest对象     var xhr = createXMLHttpRequest();      //2、通过xhr对象打开页面     xhr.onreadystatechange = function(){       //3、处理请求       if(xhr.readyState == 4 && xhr.status == 200){         //3.1、获取xml节点         var json = xhr.responseText;         // 由于返回的是一个字符串，所以需要使用eval()函数将字符串转换为json对象         var jsonObj = eval(json);         var nodes = "";         //3.2、循环获取person的信息，并组装为xml格式         for(var i = 0; i < jsonObj.length; i++){           nodes += jsonObj[i].id + "------" +                jsonObj[i].name + "------" +                jsonObj[i].age + "<br>";         }         //3.3、将person数据写入container容器中         document.getElementById("container").innerHTML = nodes;       }     }     xhr.open("POST","PersonService.php",true);     xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");     xhr.send();   }   // 获取XMLHttpRequest对象   function createXMLHttpRequest(){     var xhr;     //IE5和IE6     if(window.ActiveXObject){       try{         xhr = new ActiveXObject(Microsoft.XMLHTTP)       }catch(e){         xhr = new ActiveXObject("Msxml2.XMLHTTP");       }     }else if(window.XMLHttpRequest){       //其它主流浏览器       xhr = new XMLHttpRequest();     }else{       alert("你使用的浏览器不支持XMLHttpRequest！");       return false;     }     return xhr;   } </script>

我们通过responseText方法来获取请求返回的数据。由于返回的是一个json字符串，所以需要使用eval()函数将字符串转换为json对象。然后我们就可以遍历对象数组，并将对象的各个属性拼接为字符串打印在指定的容器中。

返回javascript教程主目录>>