Ajax学习笔记(一)

来源:互联网 发布:json添加元素 编辑:程序博客网 时间:2024/06/08 10:00

读取XML数据

html代码:innerHTML.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0  Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>Show XML</title>
 <script type="text/javascript">
  var xmlHttp;
  function createXMLHTTPRequest()
  {
  
   if(window.ActiveXObject)
   {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   else if(window.XMLHttpRequest)
   {
    xmlHttp=new XMLHttpRequest();
   }
  }
  function startRequest()
  {
   createXMLHTTPRequest();
   xmlHttp.onreadystatechange=handleStateChange;
   xmlHttp.open("GET","innerHTML.xml",true);
   xmlHttp.send(null);
  }
  function handleStateChange()
  {
   if(xmlHttp.readyState==4)
   {
    if(xmlHttp.status==200)
    {
     document.getElementById("results").innerHTML=xmlHttp.responseText;
     return;
    }
   }
  }
  </script>
 </head>
 <body>
  <input type="button" value="察看xml内容" onclick="startRequest();"/>
  <div id="results"></div>
 </body>
</html>

xml代码:innerHTML.xml

<?xml version="1.0"?>
<table border="1">
 <tbody>
  <tr>
   <th>BookName</th>
   <th>Price</th>
   <th>author</th>
  </tr>
  <tr>
   <td>Java</td>
   <td>12</td>
   <td>bbb</td>
  </tr>
  <tr>
   <td>.NET</td>
   <td>13</td>
   <td>ccc</td>
  </tr>
  <tr>
   <td>Ajax</td>
   <td>20</td>
   <td>ddd</td>
  </tr>
 </tbody>
</table>