Heim >Web-Frontend >js-Tutorial >Ajax-Methode zum Durchlaufen eines XML-Dokuments
Dieser Artikel stellt hauptsächlich die Methode zum Durchlaufen von XML-Dokumenten mit Ajax vor. Er analysiert die Implementierungstechniken für das Durchlaufen von XML-Dokumenten mit Ajax >Die Beispiele in diesem Artikel beschreiben die Ajax-Methode zum Durchlaufen von XML-Dokumenten. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:
Das XMLHttpRequest-Objekt stellt zwei Attribute bereit, die für den Zugriff auf die Serverantwort verwendet werden können. Das erste Attribut, „responseText“, stellt die Antwort als Zeichenfolge bereit, und das zweite Attribut, „responseXML“, stellt die Antwort als XML-Objekt bereit. Einige einfache Anwendungsfälle eignen sich zum Erhalten der Antwort durch einfachen Text, z. B. die Anzeige der Antwort in einem Warnfeld, oder die Antwort ist nur ein Wort, das Erfolg oder Misserfolg angibt
Das Beispiel in der vorherigen ed90a5a270fe2e7880ddf59d551d9c31 vom XMLHttpRequest-Objekt Der Server antwortet und erhält die Antwort als Text mithilfe der ResponseText-Eigenschaft des XMLHttpRequest-Objekts.Dieses Mal verwenden wir das ResponseXML-Attribut des XMLHttpRequest-Objekts, um das Ergebnis als XML-Dokument zu erhalten. Auf diese Weise können wir die W3C-DOM-Methode verwenden, um das XML-Dokument zu durchlaufen. (Im vorherigen Artikel ging es mehr oder weniger um DOM, daher werde ich es hier nicht wiederholen.)
OK, schauen wir uns das Beispiel an.
Zuallererst gibt es ein Stück XML Dokumentcode (parseXML.xml) wie folgt:
parseXML.xml lautet wie folgt:
<?xml version="1.0" encoding="UTF-8"?> <states> <north> <state>Minnesota</state> <state>Iowa</state> <state>North Dakota</state> </north> <south> <state>Texas</state> <state>Oklahoma</state> <state>Louisiana</state> </south> <east> <state>New York</state> <state>North Carolina</state> <state>Massachusetts</state> </east> <west> <state>California</state> <state>Oregon</state> <state>Nevada</state> </west> </states>
MyJsp. jsp lautet wie folgt:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'MyJsp.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <script type="text/javascript"> var flg=false; var requestType = ""; //得到XMLHttpRequest对象 function newXMLHttpRequest() { var xmlreq = false; if (window.XMLHttpRequest) { xmlreq = new XMLHttpRequest(); } else if (window.ActiveXObject) { try { xmlreq = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e1) { try { xmlreq = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e2) {} } } return xmlreq; } function startRequest(requestedList){ requestType=requestedList; flg=newXMLHttpRequest(); //当XMLHttpRequest对象在请求过程中间状态改变的时候 //回来调用handleStateChange方法 flg.onreadystatechange = handleStateChange; flg.open("GET", "parseXML.xml", true); flg.send(null); } //处理函数 function handleStateChange(){ if(flg.readyState==4){ if(flg.status==200){ if(requestType=="north"){ listNorthStates(); }else if(requestType=="all"){ listAllStates(); }if(requestType=="south"){ listSouthStates(); } } } } //用于显示NorthStates方法 function listNorthStates(){ var xmlDoc=flg.responseXML; var northNode=xmlDoc.getElementsByTagName("north")[0]; var northStates=northNode.getElementsByTagName("state"); outputList("North States",northStates); } //用于显示SouthStates方法 function listSouthStates(){ var xmlDoc=flg.responseXML; var SouthNode=xmlDoc.getElementsByTagName("south")[0]; var SouthStates=SouthNode.getElementsByTagName("state"); outputList("South States",SouthStates); } //用于显示AllStates方法 function listAllStates(){ var xmlDoc=flg.responseXML; var allStates=xmlDoc.getElementsByTagName("state"); outputList("All States in Document", allStates); } //输出元素并显示于提示框中 function outputList(title,states){ var out=title; var currState=null; for(var i=0;i<states.length;i++){ currState=states; out=out+"\n-"+currState.childNodes[0].nodeValue; } alert(out); } </script> <body> <form action="#"> <input type="button" value="View All Listed States" onclick="startRequest('all');"/><br> <input type="button" value="View All Listed Northern States" onclick="startRequest('north');"/><br> <input type="button" value="View All Listed Southern States" onclick="startRequest('south');"/> </form> </body> </html>
Verwandte Artikel:
Ajax-Upload-Methode zur Implementierung der JS-Verarbeitung basierend auf serverseitigen RückgabedatenDoppelschicht Ajax-Einbettung Satz von (kann mehrschichtigen) AnwendungsbeispielenAjax-Implementierung des Popup-Funktionscodes für die Stadtauswahl ohne AktualisierungDas obige ist der detaillierte Inhalt vonAjax-Methode zum Durchlaufen eines XML-Dokuments. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!