使用xmlHttpRequest实现Ajax技术

来源：互联网发布：阿里云的机房编辑：程序博客网时间：2024/05/01 04:56

前端的javascript脚本中使用使用xmlHttpRequest实现Ajax技术与后台进行交互，

后台使用php进行运算处理。

<html><head><script type="text/javascript">var xmlhttp;function loadXMLDoc(url){xmlhttp=null;if (window.XMLHttpRequest) {// code for IE7, Firefox, Opera, etc.    alert(2);  xmlhttp=new XMLHttpRequest();}else if( window.ActiveXObject ){alert(1111);   }if (xmlhttp!=null)  {        xmlhttp.onreadystatechange = state_Change;        xmlhttp.open("GET",url,true);        xmlhttp.send(null);  }else  {  alert("Your browser does not support XMLHTTP.");  }}function state_Change(){    if (xmlhttp.readyState == 4) {// 4 = "loaded"        alert(4);        document.getElementById('A1').innerHTML = xmlhttp.status;document.getElementById('A2').innerHTML = xmlhttp.statusText;document.getElementById('A3').innerHTML = xmlhttp.responseText;  if (xmlhttp.status==200)    {// 200 = "OK"    document.getElementById('A1').innerHTML=xmlhttp.status;    document.getElementById('A2').innerHTML=xmlhttp.statusText;    document.getElementById('A3').innerHTML=xmlhttp.responseText;    }  else    {    alert("Problem retrieving XML data:" + xmlhttp.statusText);    }  }}</script></head><body><h2>Using the HttpRequest Object</h2><p><b>Status:</b><span id="A1"></span></p><p><b>Status text:</b><span id="A2"></span></p><p><b>Response:</b><br /><span id="A3"></span></p><button onclick="loadXMLDoc('http://59.66.116.169/whether.php?city=beijing')">Get XML</button></body></html>