AJAX interacts with XML files
Interaction between ajax and XML files:
You can interact with XML files through ajax.
The most typical application is to read the content of XML files. Let’s introduce it through code examples.
The code is as follows:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="author" content="http://miracleart.cn/" /> <title>php中文網(wǎng)</title> <script> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { var xmlDoc = xmlhttp.responseXML; var str = ""; var targets = xmlDoc.getElementsByTagName("target"); for (index = 0; index < targets.length; index++) { str = str + targets[index].childNodes[0].nodeValue + "<br>"; } document.getElementById("show").innerHTML = str; } } xmlhttp.open("GET", "demo/ajax/xml/XML.xml", true); xmlhttp.send(); } window.onload = function () { var obt = document.getElementById("bt"); obt.onclick = function () { loadXMLDoc(); } } </script> </head> <body> <div> <div id="show"></div> <input id="bt" type="button" value="查看效果"/> </div> </body> </html>
In the above code, xmlhttp.responseXML returns an xml object, and then the corresponding dom operation can be used to achieve the desired effect.
xml file code is as follows:
<?xml version="1.0" encoding="utf-8" ?> <bookstore> <book> <range>前端專區(qū)</range> <author>php中文網(wǎng)</author> <target>css教程</target> </book> <book> <range>前端專區(qū)</range> <author>php中文網(wǎng)</author> <target>div教程</target> </book> <book> <range>資源專區(qū)</range> <author>php.cn</author> <target>特效下載</target> </book> <book> <range>前端專區(qū)</range> <author>php.cn</author> <target>教程下載</target> </book> </bookstore>