1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"> 3 <head> 4 <title>新建网页</title> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <meta name="description" content="" /> 7 <meta name="keywords" content="" /> 8 <script type="text/javascript"> 9 10 function createXHR() { 11 var xhr = null; 12 if(window.XMLHttpRequest) { 13 xhr = new XMLHttpRequest(); 14 } else if(window.ActiveXObject) { 15 xhr = new ActiveXObject('Microsoft.XMLHTTP'); 16 } 17 return xhr; 18 } 19 20 21 function test1() { 22 var xhr = createXHR(); 23 xhr.open('GET','08-returntype.html',true); 24 25 xhr.onreadystatechange = function() { 26 if(this.readyState == 4) { 27 //alert(this.responseXML); 28 var xmldom = this.responseXML; 29 var chs = xmldom.getElementsByTagName('book')[0]; 30 document.getElementById('btitle').value = chs.firstChild.firstChild.wholeText; 31 document.getElementById('bintro').value = chs.lastChild.firstChild.wholeText; 32 } 33 } 34 35 xhr.send(null); 36 } 37 38 39 function test2() { 40 var xhr = createXHR(); 41 xhr.open('GET','08-returnhtml.php',true); 42 43 xhr.onreadystatechange = function() { 44 if(this.readyState == 4) { 45 document.getElementById('news').innerHTML = this.responseText; 46 } 47 } 48 49 xhr.send(null); 50 } 51 52 53 function test3() { 54 var xhr = createXHR(); 55 xhr.open('GET','08-returnjson.php',true); 56 57 xhr.onreadystatechange = function() { 58 if(this.readyState == 4) { 59 var book = eval('('+this.responseText+')'); 60 document.getElementById('btitle').value = book.title; 61 document.getElementById('bintro').value = book.intro; 62 63 } 64 } 65 66 xhr.send(null); 67 } 68 69 70 </script> 71 72 <style type="text/css"> 73 </style> 74 </head> 75 <body> 76 书名:<input type="text" id="btitle" /><br /> 77 简介:<input type="text" id="bintro" /><br /> 78 79 <input type="button" value="测试返回XML" onclick="test1();" /> 80 <input type="button" value="测试返回html代码" onclick="test2();" /> 81 <input type="button" value="测试返回json格式" onclick="test3();" /> 82 83 <div id="news"> 84 </div> 85 </body> 86 </html>