PHP 和 AJAX XML 实例

AJAX 可与 XML 文件进行交互式通信。

AJAX XML 实例

在下面的 AJAX 实例中,我们将演示网页如何使用 AJAX 技术从 XML 文件中读取信息。

HTML 表单

上面的例子包含了一张简单的 HTML 表单,以及指向 JavaScript 的链接:

  1. <html>
  2. <head>
  3. <script src="selectcd.js"></script>
  4. </head>
  5.  
  6. <body>
  7.  
  8. <form>
  9. Select a CD:
  10. <select name="cds" onchange="showCD(this.value)">
  11. <option value="Bob Dylan">Bob Dylan</option>
  12. <option value="Bee Gees">Bee Gees</option>
  13. <option value="Cat Stevens">Cat Stevens</option>
  14. </select>
  15. </form>
  16.  
  17. <p>
  18. <div id="txtHint"><b>CD info will be listed here.</b></div>
  19. </p>
  20.  
  21. </body>
  22. </html>

例子解释:

正如您看到的,它仅仅是一张简单的 HTML 表单,其中带有名为 "cds" 的下拉列表。

表单下面的段落包含了一个名为 "txtHint" 的 div。这个 div 用作从 web 服务器检索到的数据的占位符。

当用户选择数据时,会执行名为 "showCD" 的函数。这个函数的执行是由 "onchange" 事件触发的。

换句话说,每当用户改变了下拉列表中的值,就会调用 showCD 函数。

XML 文件

XML 文件是 "cd_catalog.xml"。该文件中包含了有关 CD 收藏的数据。

  1. <!-- Edited by XMLSpy® -->
  2. <CATALOG>
  3. <CD>
  4. <TITLE>Empire Burlesque</TITLE>
  5. <ARTIST>Bob Dylan</ARTIST>
  6. <COUNTRY>USA</COUNTRY>
  7. <COMPANY>Columbia</COMPANY>
  8. <PRICE>10.90</PRICE>
  9. <YEAR>1985</YEAR>
  10. </CD>
  11. <CD>
  12. <TITLE>Hide your heart</TITLE>
  13. <ARTIST>Bonnie Tyler</ARTIST>
  14. <COUNTRY>UK</COUNTRY>
  15. <COMPANY>CBS Records</COMPANY>
  16. <PRICE>9.90</PRICE>
  17. <YEAR>1988</YEAR>
  18. </CD>
  19. <CD>
  20. <TITLE>Greatest Hits</TITLE>
  21. <ARTIST>Dolly Parton</ARTIST>
  22. <COUNTRY>USA</COUNTRY>
  23. <COMPANY>RCA</COMPANY>
  24. <PRICE>9.90</PRICE>
  25. <YEAR>1982</YEAR>
  26. </CD>
  27. <CD>
  28. <TITLE>Still got the blues</TITLE>
  29. <ARTIST>Gary Moore</ARTIST>
  30. <COUNTRY>UK</COUNTRY>
  31. <COMPANY>Virgin records</COMPANY>
  32. <PRICE>10.20</PRICE>
  33. <YEAR>1990</YEAR>
  34. </CD>
  35. <CD>
  36. <TITLE>Eros</TITLE>
  37. <ARTIST>Eros Ramazzotti</ARTIST>
  38. <COUNTRY>EU</COUNTRY>
  39. <COMPANY>BMG</COMPANY>
  40. <PRICE>9.90</PRICE>
  41. <YEAR>1997</YEAR>
  42. </CD>
  43. <CD>
  44. <TITLE>One night only</TITLE>
  45. <ARTIST>Bee Gees</ARTIST>
  46. <COUNTRY>UK</COUNTRY>
  47. <COMPANY>Polydor</COMPANY>
  48. <PRICE>10.90</PRICE>
  49. <YEAR>1998</YEAR>
  50. </CD>
  51. <CD>
  52. <TITLE>Sylvias Mother</TITLE>
  53. <ARTIST>Dr.Hook</ARTIST>
  54. <COUNTRY>UK</COUNTRY>
  55. <COMPANY>CBS</COMPANY>
  56. <PRICE>8.10</PRICE>
  57. <YEAR>1973</YEAR>
  58. </CD>
  59. <CD>
  60. <TITLE>Maggie May</TITLE>
  61. <ARTIST>Rod Stewart</ARTIST>
  62. <COUNTRY>UK</COUNTRY>
  63. <COMPANY>Pickwick</COMPANY>
  64. <PRICE>8.50</PRICE>
  65. <YEAR>1990</YEAR>
  66. </CD>
  67. <CD>
  68. <TITLE>Romanza</TITLE>
  69. <ARTIST>Andrea Bocelli</ARTIST>
  70. <COUNTRY>EU</COUNTRY>
  71. <COMPANY>Polydor</COMPANY>
  72. <PRICE>10.80</PRICE>
  73. <YEAR>1996</YEAR>
  74. </CD>
  75. <CD>
  76. <TITLE>When a man loves a woman</TITLE>
  77. <ARTIST>Percy Sledge</ARTIST>
  78. <COUNTRY>USA</COUNTRY>
  79. <COMPANY>Atlantic</COMPANY>
  80. <PRICE>8.70</PRICE>
  81. <YEAR>1987</YEAR>
  82. </CD>
  83. <CD>
  84. <TITLE>Black angel</TITLE>
  85. <ARTIST>Savage Rose</ARTIST>
  86. <COUNTRY>EU</COUNTRY>
  87. <COMPANY>Mega</COMPANY>
  88. <PRICE>10.90</PRICE>
  89. <YEAR>1995</YEAR>
  90. </CD>
  91. <CD>
  92. <TITLE>1999 Grammy Nominees</TITLE>
  93. <ARTIST>Many</ARTIST>
  94. <COUNTRY>USA</COUNTRY>
  95. <COMPANY>Grammy</COMPANY>
  96. <PRICE>10.20</PRICE>
  97. <YEAR>1999</YEAR>
  98. </CD>
  99. <CD>
  100. <TITLE>For the good times</TITLE>
  101. <ARTIST>Kenny Rogers</ARTIST>
  102. <COUNTRY>UK</COUNTRY>
  103. <COMPANY>Mucik Master</COMPANY>
  104. <PRICE>8.70</PRICE>
  105. <YEAR>1995</YEAR>
  106. </CD>
  107. <CD>
  108. <TITLE>Big Willie style</TITLE>
  109. <ARTIST>Will Smith</ARTIST>
  110. <COUNTRY>USA</COUNTRY>
  111. <COMPANY>Columbia</COMPANY>
  112. <PRICE>9.90</PRICE>
  113. <YEAR>1997</YEAR>
  114. </CD>
  115. <CD>
  116. <TITLE>Tupelo Honey</TITLE>
  117. <ARTIST>Van Morrison</ARTIST>
  118. <COUNTRY>UK</COUNTRY>
  119. <COMPANY>Polydor</COMPANY>
  120. <PRICE>8.20</PRICE>
  121. <YEAR>1971</YEAR>
  122. </CD>
  123. <CD>
  124. <TITLE>The very best of</TITLE>
  125. <ARTIST>Cat Stevens</ARTIST>
  126. <COUNTRY>UK</COUNTRY>
  127. <COMPANY>Island</COMPANY>
  128. <PRICE>8.90</PRICE>
  129. <YEAR>1990</YEAR>
  130. </CD>
  131. <CD>
  132. <TITLE>Stop</TITLE>
  133. <ARTIST>Sam Brown</ARTIST>
  134. <COUNTRY>UK</COUNTRY>
  135. <COMPANY>A and M</COMPANY>
  136. <PRICE>8.90</PRICE>
  137. <YEAR>1988</YEAR>
  138. </CD>
  139. <CD>
  140. <TITLE>Bridge of Spies</TITLE>
  141. <ARTIST>T'Pau</ARTIST>
  142. <COUNTRY>UK</COUNTRY>
  143. <COMPANY>Siren</COMPANY>
  144. <PRICE>7.90</PRICE>
  145. <YEAR>1987</YEAR>
  146. </CD>
  147. <CD>
  148. <TITLE>Private Dancer</TITLE>
  149. <ARTIST>Tina Turner</ARTIST>
  150. <COUNTRY>UK</COUNTRY>
  151. <COMPANY>Capitol</COMPANY>
  152. <PRICE>8.90</PRICE>
  153. <YEAR>1983</YEAR>
  154. </CD>
  155. <CD>
  156. <TITLE>Midt om natten</TITLE>
  157. <ARTIST>Kim Larsen</ARTIST>
  158. <COUNTRY>EU</COUNTRY>
  159. <COMPANY>Medley</COMPANY>
  160. <PRICE>7.80</PRICE>
  161. <YEAR>1983</YEAR>
  162. </CD>
  163. <CD>
  164. <TITLE>Pavarotti Gala Concert</TITLE>
  165. <ARTIST>Luciano Pavarotti</ARTIST>
  166. <COUNTRY>UK</COUNTRY>
  167. <COMPANY>DECCA</COMPANY>
  168. <PRICE>9.90</PRICE>
  169. <YEAR>1991</YEAR>
  170. </CD>
  171. <CD>
  172. <TITLE>The dock of the bay</TITLE>
  173. <ARTIST>Otis Redding</ARTIST>
  174. <COUNTRY>USA</COUNTRY>
  175. <COMPANY>Atlantic</COMPANY>
  176. <PRICE>7.90</PRICE>
  177. <YEAR>1987</YEAR>
  178. </CD>
  179. <CD>
  180. <TITLE>Picture book</TITLE>
  181. <ARTIST>Simply Red</ARTIST>
  182. <COUNTRY>EU</COUNTRY>
  183. <COMPANY>Elektra</COMPANY>
  184. <PRICE>7.20</PRICE>
  185. <YEAR>1985</YEAR>
  186. </CD>
  187. <CD>
  188. <TITLE>Red</TITLE>
  189. <ARTIST>The Communards</ARTIST>
  190. <COUNTRY>UK</COUNTRY>
  191. <COMPANY>London</COMPANY>
  192. <PRICE>7.80</PRICE>
  193. <YEAR>1987</YEAR>
  194. </CD>
  195. <CD>
  196. <TITLE>Unchain my heart</TITLE>
  197. <ARTIST>Joe Cocker</ARTIST>
  198. <COUNTRY>USA</COUNTRY>
  199. <COMPANY>EMI</COMPANY>
  200. <PRICE>8.20</PRICE>
  201. <YEAR>1987</YEAR>
  202. </CD>
  203. </CATALOG>

JavaScript

这是存储在 "selectcd.js" 文件中的 JavaScript 代码:

  1. var xmlHttp
  2.  
  3. function showCD(str)
  4. {
  5. xmlHttp=GetXmlHttpObject()
  6. if (xmlHttp==null)
  7. {
  8. alert ("Browser does not support HTTP Request")
  9. return
  10. }
  11. var url="getcd.php"
  12. url=url+"?q="+str
  13. url=url+"&sid="+Math.random()
  14. xmlHttp.onreadystatechange=stateChanged
  15. xmlHttp.open("GET",url,true)
  16. xmlHttp.send(null)
  17. }
  18.  
  19. function stateChanged()
  20. {
  21. if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  22. {
  23. document.getElementById("txtHint").innerHTML=xmlHttp.responseText
  24. }
  25. }
  26.  
  27. function GetXmlHttpObject()
  28. {
  29. var xmlHttp=null;
  30.  
  31. try
  32. {
  33. // Firefox, Opera 8.0+, Safari
  34. xmlHttp=new XMLHttpRequest();
  35. }
  36. catch (e)
  37. {
  38. // Internet Explorer
  39. try
  40. {
  41. xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  42. }
  43. catch (e)
  44. {
  45. xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  46. }
  47. }
  48. return xmlHttp;
  49. }

例子解释:

stateChanged() 和 GetXmlHttpObject 函数与上一节中的相同,您可以参阅上一页中的相关解释。

showCD() 函数

假如选择了下拉列表中的某个项目,则函数执行:

  • 调用 GetXmlHttpObject 函数来创建 XMLHTTP 对象
  • 定义发送到服务器的 URL(文件名)
  • 向 URL 添加带有下拉列表内容的参数 (q)
  • 添加一个随机数,以防服务器使用缓存的文件
  • 当触发事件时调用 stateChanged
  • 通过给定的 URL 打开 XMLHTTP 对象
  • 向服务器发送 HTTP 请求

PHP 页面

这个被 JavaScript 调用的服务器页面,是一个名为 "getcd.php" 的简单 PHP 文件。

这张页面是用 PHP 编写的,使用 XML DOM 来加载 XML 文档 "cd_catalog.xml":

  1. <!-- Edited by XMLSpy® -->
  2. <CATALOG>
  3. <CD>
  4. <TITLE>Empire Burlesque</TITLE>
  5. <ARTIST>Bob Dylan</ARTIST>
  6. <COUNTRY>USA</COUNTRY>
  7. <COMPANY>Columbia</COMPANY>
  8. <PRICE>10.90</PRICE>
  9. <YEAR>1985</YEAR>
  10. </CD>
  11. <CD>
  12. <TITLE>Hide your heart</TITLE>
  13. <ARTIST>Bonnie Tyler</ARTIST>
  14. <COUNTRY>UK</COUNTRY>
  15. <COMPANY>CBS Records</COMPANY>
  16. <PRICE>9.90</PRICE>
  17. <YEAR>1988</YEAR>
  18. </CD>
  19. <CD>
  20. <TITLE>Greatest Hits</TITLE>
  21. <ARTIST>Dolly Parton</ARTIST>
  22. <COUNTRY>USA</COUNTRY>
  23. <COMPANY>RCA</COMPANY>
  24. <PRICE>9.90</PRICE>
  25. <YEAR>1982</YEAR>
  26. </CD>
  27. <CD>
  28. <TITLE>Still got the blues</TITLE>
  29. <ARTIST>Gary Moore</ARTIST>
  30. <COUNTRY>UK</COUNTRY>
  31. <COMPANY>Virgin records</COMPANY>
  32. <PRICE>10.20</PRICE>
  33. <YEAR>1990</YEAR>
  34. </CD>
  35. <CD>
  36. <TITLE>Eros</TITLE>
  37. <ARTIST>Eros Ramazzotti</ARTIST>
  38. <COUNTRY>EU</COUNTRY>
  39. <COMPANY>BMG</COMPANY>
  40. <PRICE>9.90</PRICE>
  41. <YEAR>1997</YEAR>
  42. </CD>
  43. <CD>
  44. <TITLE>One night only</TITLE>
  45. <ARTIST>Bee Gees</ARTIST>
  46. <COUNTRY>UK</COUNTRY>
  47. <COMPANY>Polydor</COMPANY>
  48. <PRICE>10.90</PRICE>
  49. <YEAR>1998</YEAR>
  50. </CD>
  51. <CD>
  52. <TITLE>Sylvias Mother</TITLE>
  53. <ARTIST>Dr.Hook</ARTIST>
  54. <COUNTRY>UK</COUNTRY>
  55. <COMPANY>CBS</COMPANY>
  56. <PRICE>8.10</PRICE>
  57. <YEAR>1973</YEAR>
  58. </CD>
  59. <CD>
  60. <TITLE>Maggie May</TITLE>
  61. <ARTIST>Rod Stewart</ARTIST>
  62. <COUNTRY>UK</COUNTRY>
  63. <COMPANY>Pickwick</COMPANY>
  64. <PRICE>8.50</PRICE>
  65. <YEAR>1990</YEAR>
  66. </CD>
  67. <CD>
  68. <TITLE>Romanza</TITLE>
  69. <ARTIST>Andrea Bocelli</ARTIST>
  70. <COUNTRY>EU</COUNTRY>
  71. <COMPANY>Polydor</COMPANY>
  72. <PRICE>10.80</PRICE>
  73. <YEAR>1996</YEAR>
  74. </CD>
  75. <CD>
  76. <TITLE>When a man loves a woman</TITLE>
  77. <ARTIST>Percy Sledge</ARTIST>
  78. <COUNTRY>USA</COUNTRY>
  79. <COMPANY>Atlantic</COMPANY>
  80. <PRICE>8.70</PRICE>
  81. <YEAR>1987</YEAR>
  82. </CD>
  83. <CD>
  84. <TITLE>Black angel</TITLE>
  85. <ARTIST>Savage Rose</ARTIST>
  86. <COUNTRY>EU</COUNTRY>
  87. <COMPANY>Mega</COMPANY>
  88. <PRICE>10.90</PRICE>
  89. <YEAR>1995</YEAR>
  90. </CD>
  91. <CD>
  92. <TITLE>1999 Grammy Nominees</TITLE>
  93. <ARTIST>Many</ARTIST>
  94. <COUNTRY>USA</COUNTRY>
  95. <COMPANY>Grammy</COMPANY>
  96. <PRICE>10.20</PRICE>
  97. <YEAR>1999</YEAR>
  98. </CD>
  99. <CD>
  100. <TITLE>For the good times</TITLE>
  101. <ARTIST>Kenny Rogers</ARTIST>
  102. <COUNTRY>UK</COUNTRY>
  103. <COMPANY>Mucik Master</COMPANY>
  104. <PRICE>8.70</PRICE>
  105. <YEAR>1995</YEAR>
  106. </CD>
  107. <CD>
  108. <TITLE>Big Willie style</TITLE>
  109. <ARTIST>Will Smith</ARTIST>
  110. <COUNTRY>USA</COUNTRY>
  111. <COMPANY>Columbia</COMPANY>
  112. <PRICE>9.90</PRICE>
  113. <YEAR>1997</YEAR>
  114. </CD>
  115. <CD>
  116. <TITLE>Tupelo Honey</TITLE>
  117. <ARTIST>Van Morrison</ARTIST>
  118. <COUNTRY>UK</COUNTRY>
  119. <COMPANY>Polydor</COMPANY>
  120. <PRICE>8.20</PRICE>
  121. <YEAR>1971</YEAR>
  122. </CD>
  123. <CD>
  124. <TITLE>The very best of</TITLE>
  125. <ARTIST>Cat Stevens</ARTIST>
  126. <COUNTRY>UK</COUNTRY>
  127. <COMPANY>Island</COMPANY>
  128. <PRICE>8.90</PRICE>
  129. <YEAR>1990</YEAR>
  130. </CD>
  131. <CD>
  132. <TITLE>Stop</TITLE>
  133. <ARTIST>Sam Brown</ARTIST>
  134. <COUNTRY>UK</COUNTRY>
  135. <COMPANY>A and M</COMPANY>
  136. <PRICE>8.90</PRICE>
  137. <YEAR>1988</YEAR>
  138. </CD>
  139. <CD>
  140. <TITLE>Bridge of Spies</TITLE>
  141. <ARTIST>T'Pau</ARTIST>
  142. <COUNTRY>UK</COUNTRY>
  143. <COMPANY>Siren</COMPANY>
  144. <PRICE>7.90</PRICE>
  145. <YEAR>1987</YEAR>
  146. </CD>
  147. <CD>
  148. <TITLE>Private Dancer</TITLE>
  149. <ARTIST>Tina Turner</ARTIST>
  150. <COUNTRY>UK</COUNTRY>
  151. <COMPANY>Capitol</COMPANY>
  152. <PRICE>8.90</PRICE>
  153. <YEAR>1983</YEAR>
  154. </CD>
  155. <CD>
  156. <TITLE>Midt om natten</TITLE>
  157. <ARTIST>Kim Larsen</ARTIST>
  158. <COUNTRY>EU</COUNTRY>
  159. <COMPANY>Medley</COMPANY>
  160. <PRICE>7.80</PRICE>
  161. <YEAR>1983</YEAR>
  162. </CD>
  163. <CD>
  164. <TITLE>Pavarotti Gala Concert</TITLE>
  165. <ARTIST>Luciano Pavarotti</ARTIST>
  166. <COUNTRY>UK</COUNTRY>
  167. <COMPANY>DECCA</COMPANY>
  168. <PRICE>9.90</PRICE>
  169. <YEAR>1991</YEAR>
  170. </CD>
  171. <CD>
  172. <TITLE>The dock of the bay</TITLE>
  173. <ARTIST>Otis Redding</ARTIST>
  174. <COUNTRY>USA</COUNTRY>
  175. <COMPANY>Atlantic</COMPANY>
  176. <PRICE>7.90</PRICE>
  177. <YEAR>1987</YEAR>
  178. </CD>
  179. <CD>
  180. <TITLE>Picture book</TITLE>
  181. <ARTIST>Simply Red</ARTIST>
  182. <COUNTRY>EU</COUNTRY>
  183. <COMPANY>Elektra</COMPANY>
  184. <PRICE>7.20</PRICE>
  185. <YEAR>1985</YEAR>
  186. </CD>
  187. <CD>
  188. <TITLE>Red</TITLE>
  189. <ARTIST>The Communards</ARTIST>
  190. <COUNTRY>UK</COUNTRY>
  191. <COMPANY>London</COMPANY>
  192. <PRICE>7.80</PRICE>
  193. <YEAR>1987</YEAR>
  194. </CD>
  195. <CD>
  196. <TITLE>Unchain my heart</TITLE>
  197. <ARTIST>Joe Cocker</ARTIST>
  198. <COUNTRY>USA</COUNTRY>
  199. <COMPANY>EMI</COMPANY>
  200. <PRICE>8.20</PRICE>
  201. <YEAR>1987</YEAR>
  202. </CD>
  203. </CATALOG>

代码运行针对 XML 文件的查询,并以 HTML 返回结果:

  1. <?php
  2. $q=$_GET["q"];
  3.  
  4. $xmlDoc = new DOMDocument();
  5. $xmlDoc->load("cd_catalog.xml");
  6.  
  7. $x=$xmlDoc->getElementsByTagName('ARTIST');
  8.  
  9. for ($i=0; $i<=$x->length-1; $i++)
  10. {
  11. //Process only element nodes
  12. if ($x->item($i)->nodeType==1)
  13. {
  14. if ($x->item($i)->childNodes->item(0)->nodeValue == $q)
  15. {
  16. $y=($x->item($i)->parentNode);
  17. }
  18. }
  19. }
  20.  
  21. $cd=($y->childNodes);
  22.  
  23. for ($i=0;$i<$cd->length;$i++)
  24. {
  25. //Process only element nodes
  26. if ($cd->item($i)->nodeType==1)
  27. {
  28. echo($cd->item($i)->nodeName);
  29. echo(": ");
  30. echo($cd->item($i)->childNodes->item(0)->nodeValue);
  31. echo("<br />");
  32. }
  33. }
  34. ?>

例子解释

当请求从 JavaScript 发送到 PHP 页面时,发生:

  • PHP 创建 "cd_catalog.xml" 文件的 XML DOM 对象
  • 循环所有 "artist" 元素 (nodetypes = 1),查找与 JavaScript 所传数据向匹配的名字
  • 找到 CD 包含的正确 artist
  • 输出 album 的信息,并发送到 "txtHint" 占位符