Ajax返回html和json格式数据_H5之家 - 中国HTML5教程资源分享第一站

Ajax可以返回text和xml格式可以用Ajax返回大段的html文本和json格式的字符串，然后用eval()方法转化为json对象 php中的json编码：json_encode(); php中的json解码：json_decode();

前端页面

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta content="EditPlus®"> <meta content=""> <meta content=""> <meta content=""> <title>Document</title> <script type="text/javascript"> function returnjson(){ var xhr=new XMLHttpRequest(); xhr.open('GET','./01.php',true); xhr.onreadystatechange=function (){ if(this.readyState==4){ //直接接收是有规律的字符串 //alert(this.responseText); var json=eval('('+this.responseText+')'); var str='名字：'+json.name+"<br/>"; str=str+'年龄：'+json.age+"<br/>"; document.getElementById('json').innerHTML=str; } } xhr.send(null); } function returnhtml(){ var xhr=new XMLHttpRequest(); xhr.open('GET','./02.php',true); xhr.onreadystatechange=function (){ if(this.readyState==4){ document.getElementById('html').innerHTML=this.responseText; } } xhr.send(null); } </script> </head> <body> <form> <input type="button" value="返回json格式数据"/> <input type="button" value="返回html格式数据"/> <div>这里显示返回json的信息</div> <div>这里显示返回html的信息</div> <form> </body> </html>

01.php

<?php //可以从数据库中取数据 ?> {name:'lisi',age:18}

02.php

<?php //从数据库中取出数据，用php打印成html代码 $arr=array('数据1','数据2','数据3'); foreach($arr as $v){ echo '<li>'.$v.'</li>'; } ?>