AJAX는 XML 파일과 상...LOGIN

AJAX는 XML 파일과 상호 작용합니다.

ajax는 XML 파일과 상호 작용합니다.

ajax를 통해 XML 파일과 상호 작용할 수 있습니다.

가장 일반적인 응용 프로그램은 XML 파일의 내용을 읽는 것입니다. 코드 예제를 통해 소개하겠습니다.

코드는 다음과 같습니다.

<!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://www.php.cn/" /> 
<title>php中文网</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>

위 코드에서 xmlhttp.responseXML은 xml 객체를 반환한 다음 해당 dom 연산을 사용하여 원하는 효과를 얻을 수 있습니다.

xml 파일 코드는 다음과 같습니다.

<?xml version="1.0" encoding="utf-8" ?>
<bookstore>
  <book>
    <range>前端专区</range>
    <author>php中文网</author>
    <target>css教程</target>
  </book>
  <book>
    <range>前端专区</range>
    <author>php中文网</author>
    <target>div教程</target>
  </book>
  <book>
    <range>资源专区</range>
    <author>php.cn</author>
    <target>特效下载</target>
  </book>
  <book>
    <range>前端专区</range>
    <author>php.cn</author>
    <target>教程下载</target>
  </book>
</bookstore>


<!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://www.php.cn/" /> <title>php中文网</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>
코스웨어