• <nav id="wkkge"><strong id="wkkge"></strong></nav>
  • <menu id="wkkge"></menu>
  • AJAX教程

    AJAX XML實例

     

     

    AJAX 可用來與 XML 文件進行交互式通信。

     

    本節通過解析實例來使你了解AJAX是如何讀取XML文件的信息的!

     

    我們首先實例化或創建XMLHttpRequest(XHR)對象實例化或創建JavaScript的對象:

     

    xhr = new XMLHttpRequest();

     

    但是,IE5和IE6不支持XMLHttpRequest,您需要以不同的方式實例化它:

     

    xhr = new ActiveXObject ("Msxml2.XMLHTTP")

     

    注:Windows 10附帶的Microsoft Edge默認Web瀏覽器自然支持XMLHttpRequest的。)

     

    因此,實例化XHR變得有點麻煩,你必須首先測試用戶的瀏覽器如何支持它。

     

    var xhr;
    if(window.XMLHttpRequest){ //適用于大多數現代Web瀏覽器
        xhr = new XMLHttpRequest();
    }
    else(window.ActiveXObject){ //對于IE5,IE6
        xhr = new ActiveXObject("Msxml2.XMLHTTP");
    }

     

     

    AJAX XML 實例

     

    下面的例子將演示網頁如何使用 AJAX 來讀取來自 XML 文件的信息:

     

    實例

     

    Get CD info

     

     

    實例解釋 - loadXMLDoc() 函數

     

    當用戶點擊上面的“獲得 CD 信息”這個按鈕,就會執行 loadXMLDoc() 函數。

     

    loadXMLDoc() 函數創建 XMLHttpRequest 對象,添加當服務器響應就緒時執行的函數,并將請求發送到服務器。

     

    當服務器響應就緒時,會構建一個 HTML 表格,從 XML 文件中提取節點(元素),最后使用已經填充了 XML 數據的 HTML 表格來更新 txtCDInfo 占位符:

     

    function loadXMLDoc(url)
    {
    var xmlhttp;
    var txt,xx,x,i;
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        txt="<table border='1'><tr><th>Title</th><th>Artist</th></tr>";
        x=xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
        for (i=0;i<x.length;i++)
          {
          txt=txt + "<tr>";
          xx=x[i].getElementsByTagName("TITLE");
            {
            try
              {
              txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
              }
            catch (er)
              {
              txt=txt + "<td> </td>";
              }
            }
        xx=x[i].getElementsByTagName("ARTIST");
          {
            try
              {
              txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
              }
            catch (er)
              {
              txt=txt + "<td> </td>";
              }
            }
          txt=txt + "</tr>";
          }
        txt=txt + "</table>";
        document.getElementById('txtCDInfo').innerHTML=txt;
        }
      }
    xmlhttp.open("GET",url,true);
    xmlhttp.send();
    }

     

     

    AJAX 服務器頁面

     

    上面這個例子中使用的服務器頁面實際上是一個 XML 文件,名為 "cd_catalog.xml"。

     

    全部教程
  • <nav id="wkkge"><strong id="wkkge"></strong></nav>
  • <menu id="wkkge"></menu>
  • 面对面棋牌游戏