package cn.limaoyuan.jquery.xml;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class JqueryServletForXml extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("into JqueryServletForXml");
//response.setContentType("text/html"); //以text/html方式返回
response.setContentType("text/xml");
response.setCharacterEncoding("gbk");
String xml = "<?xml version=\"1.0\" encoding=\"gbk\"?><userlist><user><name>limy_1</name><age>25_1</age></user><user><name>limy_2</name><age>25_2</age></user></userlist>";
response.getWriter().println(xml);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}
2.页面的东东
程序代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>StripingTable</title>
<style type="text/css">
<!--
*.*{
font-size: 12px;
}
-->
</style>
<script type="text/javascript" src="jquery-1.2.1.js"></script>
<script type="text/javascript" src="loadxml.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){});
function getAjaxByXml(){
$("#info").ajaxStart(function(){
$(this).attr("innerHTML","开始加载!");
});
$("#info").ajaxError(function(request, settings){
$(this).attr("innerHTML","出错页面:" + settings.url);
});
$("#info").ajaxSuccess(function(){
$(this).attr("innerHTML","加载完成!");
});
$.post("../servlet/JqueryServletForXml",{t:new Date()},function(data){
//1.服务器设置的text/xml格式
var node = data.selectNodes("//user"); //这里data直接就已经是xml对象了,可以直接使用xpath进行解析
for(var i=0;i<node.length;i++){
var children = node[i].childNodes; //得到user节点的子节点集合
var childLen = children.length;
for(var j=0;j<childLen;j++){
//alert(children[j].firstChild.nodeValue); //得到子节点第一个文本对象的值
$("#responseText").append(children[j].firstChild.nodeValue +" ");
}
}
//2.如果服务器设置返回的是text/html,而又想用xml对象,那么就需要单独来转换一下
var xmlDoc = loadXML(false,data);//这时的data只是普通的字条串,经过这步后的xmlDoc才是xml对象了
var node = xmlDoc.selectNodes("//user"); //得到所有user节点
for(var i=0;i<node.length;i++){
var children = node[i].childNodes; //得到user节点的子节点集合
var childLen = children.length;
for(var j=0;j<childLen;j++){
//alert(children[j].firstChild.nodeValue); //得到子节点第一个文本对象的值
$("#responseText").append(children[j].firstChild.nodeValue +" ");
}
}
//3.纯jquery解析xml,前提返回的要是text/xml格式
//var name = $(data).find("user").find("name").eq(1).text();//如果单取某一个user可以用eq(index)这个方法
$(data).find("user").each(function(){
var name = $(this).find("name").text();
var age = $(this).find("age").text();
$("#responseText").append(name+" " + age + " <br/>");
});
//4.纯jquery解析xml,方法二!更深奥,当然方法没有第3种简便,关键是掌握取得层次关系可以用find(父级+空格+子级)来定位
$(data).find("user").each(function(i){
var name = $(data).find("user name").eq(i).text(); //用find的另一个用法(父级+空格+子级)
var age = $(data).find("user age").eq(i).text();
$("#responseText").append(name+" " + age + " <br/>");
});
});
}
-->
</script>
</head>
<body>
<input type="button" value="测试服务器回传xml" onclick="getAjaxByXml()"/>
<div id="responseText"></div>
<div id="info"></div>
</bdoy>
</html>
3.提供一个js生成xml对象的类loadxml.js
程序代码
/**
* 封装装载XML的方法,并返回XML文档的根元素节点。
* @param flag true时参数xml表示xml文档的名称;false时参数xml是一个字符串,其内容是一个xml文档
* @param xml 根据flag参数的不同表示xml文档的名称或一个xml文档的字符串表示
*/
function loadXML(flag,xml){
var xmlDoc;
//针对IE浏览器
if(window.ActiveXObject){
var aVersions = ["MSXML2.DOMDocument.6.0","MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0","MSXML2.DOMDocument","Microsoft.XmlDom"];
for (var i = 0; i < aVersions.length; i++) {
try {
//建立xml对象
xmlDoc = new ActiveXObject(aVersions[i]);
break;
} catch (oError) {
}
}
if(xmlDoc != null){
//同步方式加载XML数据
xmlDoc.async = false;
//根据XML文档名称装载
if(flag == true){
xmlDoc.load(xml);
} else{
//根据表示XML文档的字符串装载
xmlDoc.loadXML(xml);
}
//返回XML文档的根元素节点。
return xmlDoc.documentElement;
}
} else{
//针对非IE浏览器
if(document.implementation && document.implementation.createDocument){
/*
第一个参数表示XML文档使用的namespace的URL地址
第二个参数表示要被建立的XML文档的根节点名称
第三个参数是一个DOCTYPE类型对象,表示的是要建立的XML文档中DOCTYPE部分的定义,通常我们直接使用null
这里我们要装载一个已有的XML文档,所以首先建立一个空文档,因此使用下面的方式
*/
xmlDoc = document.implementation.createDocument("","",null);
if(xmlDoc != null){
//根据XML文档名称装载
if(flag == true){
//同步方式加载XML数据
xmlDoc.async = false;
xmlDoc.load(xml);
} else{
//根据表示XML文档的字符串装载
var oParser = new DOMParser();
xmlDoc = oParser.parseFromString(xml,"text/xml");
}
//返回XML文档的根元素节点。
return xmlDoc.documentElement;
}
}
}
return null;
}
分享到:
相关推荐
关于jq读取xml的,有需要的朋友可以下载。
jQuery解析xml文件,实现省市县三级联动下拉框
jquery解析xml
JQuery 省市县三级联动 ,解析中国城市XML,实现联动。需在本地有服务
jquery解析xml并实现省市二级联动
Jquery操作xml_Demo。 帮一个朋友做的一个Demo实例,用jquery读取xml文件,很简单的操作,一看就明白。
主要介绍了使用jquery解析XML的方法,代码简洁实用,需要的朋友可以参考下
本文实例总结了JQuery解析XML的方法。分享给大家供大家参考,具体如下: 用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做。下面我们来总结几个使用JQuery解析XML的例子。 第一种方案...
下面小编就为大家带来一篇JQuery解析XML数据的几个简单实例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
jQuery加载并解析XML
对于HTML的解析,我是使用jQuery非常方便,其实,我们也可以用jquery解析XML,也是同样的方便。 如果你用过Java、PHP等语言解析过XML,相信会跟我有相同的感觉,那就是很麻烦。改用jQuery来读取、分析、操作XML后,...
NULL 博文链接:https://a52071453.iteye.com/blog/1673903
NULL 博文链接:https://qyongkang.iteye.com/blog/585382
下面小编就为大家带来一篇jquery解析XML及获取XML节点名称的实现代码。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
通过示例为大家介绍了使用jquery解析XML的方法,经测试比较实用,需要的朋友可以参考下