Ajax学习（xml的使用）

Ajax学习（xml的应用）
//服务器................

public class AJAXXmlServer extends HttpServlet{
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//=============写成text/xml
response.setContentType("text/xml;charset=UTF-8");
PrintWriter out=response.getWriter();
String name=request.getParameter("username");
StringBuilder builder=new StringBuilder();
builder.append("<message>");
System.out.println(name);
if(name==null||"".equals(name)){
builder.append("请输入用户名").append("</message>");
}else{
if("ygl".equals(name)){
builder.append("用户名已存在，请重新输入").append("</message>");
}else{
builder.append("用户名可以使用").append("</message>");
}
}
out.print(builder);
}

protected void doPost(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws ServletException, IOException {
doGet(httpServletRequest,httpServletResponse);
}
}
//===================================================================
//=======js 部分的ajax

var xhr;
function verify(){
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
if(xhr.overrideMimeType){
xhr.overrideMimeType("text/xml");
}
}else if(window.ActiveXObject){
var activeName=["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for(var i=0;i<activeName.length;i++){
try{
xhr=new ActiveXObject(activeName[i]);

}catch(e){}
}
}
xhr.onreadystatechange=callback;
xhr.open("POST","AJAXXmlServer",true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
var username=document.getElementById("username").value;
alert(username);
xhr.send("username="+username);
}
function callback(){
if(xhr.readyState==4){
if(xhr.status==200){
var resultNode=document.getElementById("result");
//......................XML专用
var responseNode=xhr.responseXML;
if(responseNode){
var messageNodes =responseNode.getElementsByTagName("message");
if(messageNodes.length>0){
var childNode=messageNodes[0].firstChild;
var messageValue=childNode.nodeValue;
resultNode.innerHTML=messageValue;
}else{
alert("XML数据格式错误，原始文本内容为：" + xhr.responseText);
}
}else{
alert("xhr.responseXML没有获取到：" + xhr.responseText);
resultNode.innerHTML=xhr.responseText;
}
}else{
alert("出错了");
}
}
}
//=========================================================
//用jquery
function verify(){
var username=$("#username").val();
$.ajax({
type:"GET",
url:"AJAXXmlServer",
data:"username="+username,
dataType:"xml" ,
success:callback
});

//上面写post 或get 其他的不改好像都一样反正都可以成功
}
function callback(data){
var jequeryObj=$(data);
var messageNode=jequeryObj.children();
var messageText=messageNode.text();
var resultNode=$("#result");
resultNode.html(messageText);
}

//====================================================================

//html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script type="text/javascript" src="jslib/verifyXml.js"></script>
</head>
<body>
用名： <input name="username" id="username"/><br/>
<input type="button" onclick="verify()" value="校验"/>

<div id="result"></div>
</body>
</html>

Ajax学习（xml的使用）

热点推荐