通过AJAX的JS、JQuery两种方式解析XML示例介绍


Posted in Javascript onSeptember 23, 2013

JQuery版

$.ajax({ 
url : "order/order_orderDetail.do?params.type=merge", 
type : "post", 
data : params, 
success : function(xml) { 
hide(); 
if(xml == ""){ 
Dialog.popTip("找不到需要合并的订单", 2); 
}else{ 
var myTable=document.getElementById( "t_product" ); 
//遍历"ORDER"节点 
$(xml).find('ORDER').each(function(){ 
var id = $(this).find("ORDERID").text(); 
var status = $(this).find("STATUS").text(); if(status == "1"){ 
status="未确认"; 
}else{ 
status="已确认"; 
} 
var newRow = myTable.insertRow(); 
var oCell = newRow.insertCell(); 
oCell.setAttribute("height","25"); 
oCell.innerHTML=" "; 
oCell = newRow.insertCell(); 
oCell.innerHTML="*<b>订单<span style=\"color:red\">"+id+"</span> 的状态为:<span style=\"color:red\">"+status+"</span></b>,商品情况如下<input type=\"checkbox\" name=\"mOrder\" value="+id+" onclick=\"mergeOrder();\">"; 
oCell = newRow.insertCell(); 
oCell.innerHTML=" "; 
oCell = newRow.insertCell(); 
oCell.innerHTML=" "; 
//遍历"PRODUCT"节点 
$(this).find('PRODUCT').each(function(){ 
var pid = $(this).find("PRODUCTID").text(); 
var pname = $(this).find("PRODUCTNAME").text(); 
var purl = $(this).find("PRODUCTURL").text(); 
var pprice = $(this).find("PRICE").text(); 
var pcount = $(this).find("GOODSCOUNT").text(); 
newRow = myTable.insertRow(); 
oCell = newRow.insertCell(); 
oCell.setAttribute("height","25"); 
oCell.innerHTML=pid; 
oCell = newRow.insertCell(); 
oCell.innerHTML="<a href=\""+purl+"\" target=\"_blank\">"+pname+"</a>"; 
oCell = newRow.insertCell(); 
oCell.innerHTML="<img style=\"cursor: pointer; vertical-align: middle\" src=\"./images/-.png\" onclick=\"return plus('p"+pid+"','"+pprice+"')\" /><input style=\"width: 20px; border: 0; text-align: center;\" type=\"text\" id=\"p"+pid+"\" name=\"order.count\" class=\"txt\" value="+pcount+" readonly /><img style=\"cursor: pointer; vertical-align: middle\" src=\"./images/+.png\" onclick=\"return add('p"+pid+"','"+pprice+"')\">" 
oCell = newRow.insertCell(); 
oCell.innerHTML=pprice; 
}); 
}); 
} 
}, 
error : function() { 
hide(); 
Dialog.popTip("服务器繁忙", 2); 
} 
});

JS版
if(xmlHttp.readyState ==4){ 
if(xmlHttp.status ==200){ 
hide(); 
var xml = xmlHttp.responseXML; 
if(xml == null){ 
Dialog.popTip("找不到需要合并的订单", 2); 
}else{ 
var myTable=document.getElementById("t_product" ); 
var orders = xml.getElementsByTagName("ORDER"); 
for(var i=0;i<orders.length;i++){ 
var order = orders[i]; 
var id = order.getElementsByTagName("ORDERID")[0].childNodes[0].nodeValue; 
var status =order.getElementsByTagName("STATUS")[0].childNodes[0].nodeValue; 
alert(status); 
if(status == "1"){ 
status="未确认"; 
}else{ 
status="已确认"; 
} 
var newRow = myTable.insertRow(); 
var oCell = newRow.insertCell(); 
oCell.setAttribute("height","25"); 
oCell.innerHTML=" "; 
oCell = newRow.insertCell(); 
oCell.innerHTML="*<b>订单<span style=\"color:red\">"+id+"</span> 的状态为:<span style=\"color:red\">"+status+"</span></b>,商品情况如下<input type=\"checkbox\" name=\"mOrder\" value="+id+" onclick=\"mergeOrder();\">"; 
oCell = newRow.insertCell(); 
oCell.innerHTML=" "; 
oCell = newRow.insertCell(); 
oCell.innerHTML=" "; var products = order.getElementsByTagName("PRODUCT"); 
for(var i=0;i<orders.length;i++){ 
var product = products[i]; 
var pid = product.getElementsByTagName("PRODUCTID")[0].childNodes[0].nodeValue; 
var pname = product.getElementsByTagName("PRODUCTNAME")[0].childNodes[0].nodeValue; 
var purl = product.getElementsByTagName("PRODUCTURL")[0].childNodes[0].nodeValue; 
var pprice = product.getElementsByTagName("PRICE")[0].childNodes[0].nodeValue; 
var pcount = product.getElementsByTagName("GOODSCOUNT")[0].childNodes[0].nodeValue; 
newRow = myTable.insertRow(); 
oCell = newRow.insertCell(); 
oCell.setAttribute("height","25"); 
oCell.innerHTML=pid; 
oCell = newRow.insertCell(); 
oCell.innerHTML="<a href=\""+purl+"\" target=\"_blank\">"+pname+"</a>"; 
oCell = newRow.insertCell(); 
oCell.innerHTML="<img style=\"cursor: pointer; vertical-align: middle\" src=\"./images/-.png\" onclick=\"return plus('p"+pid+"','"+pprice+"')\" /><input style=\"width: 20px; border: 0; text-align: center;\" type=\"text\" id=\"p"+pid+"\" name=\"order.count\" class=\"txt\" value="+pcount+" readonly /><img style=\"cursor: pointer; vertical-align: middle\" src=\"./images/+.png\" onclick=\"return add('p"+pid+"','"+pprice+"')\">" 
oCell = newRow.insertCell(); 
oCell.innerHTML=pprice; 
} 
} 
} 
} 
}
Javascript 相关文章推荐
jQuery UI AutoComplete 使用说明
Jun 20 Javascript
js change,propertychange,input事件小议
Dec 20 Javascript
使用JavaScript获取地址栏参数的方法
Dec 19 Javascript
详解JavaScript基于面向对象之继承实例
Dec 16 Javascript
JavaScript实现斗地主游戏的思路
Feb 29 Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 Javascript
jQuery数组处理函数整理
Aug 03 Javascript
获取jqGrid中选择的行的数据
Nov 30 Javascript
JavaScript实现网页头部进度条刷新
Apr 16 Javascript
解决vue点击控制单个样式的问题
Sep 05 Javascript
详解如何构建一个Angular6的第三方npm包
Sep 07 Javascript
vue router动态路由设置参数可选问题
Aug 21 Javascript
js如何取消事件冒泡
Sep 23 #Javascript
页面载入结束自动调用js函数示例
Sep 23 #Javascript
往光标所在位置插入值的js代码
Sep 22 #Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
Sep 22 #Javascript
jquery设置元素的readonly和disabled的写法
Sep 22 #Javascript
JS 毫秒转时间示例代码
Sep 22 #Javascript
javascript获取设置div的高度和宽度兼容任何浏览器
Sep 22 #Javascript
You might like
虫族 ZERG 概述
2020/03/14 星际争霸
PHP iconv 函数转gb2312的bug解决方法
2009/10/11 PHP
Parse正式发布开源PHP SDK
2014/08/11 PHP
php使用gzip压缩传输js和css文件的方法
2015/07/29 PHP
php获取一定范围内取N个不重复的随机数
2016/05/28 PHP
js option删除代码集合
2008/11/12 Javascript
javascript full screen 全屏显示页面元素的方法
2013/09/27 Javascript
js对象内部访问this修饰的成员函数示例
2014/04/27 Javascript
JavaScript中Date.toSource()方法的使用教程
2015/06/12 Javascript
JS功能代码集锦
2016/05/04 Javascript
Jq通过td获取同行其它列td的方法
2016/10/05 Javascript
Nodejs下DNS缓存问题浅析
2016/11/16 NodeJs
javascript 初学教程及五子棋小程序的简单实现
2017/07/04 Javascript
iscroll动态加载数据完美解决方法
2017/07/18 Javascript
vue解决跨域问题(推荐)
2020/11/10 Javascript
跟老齐学Python之用Python计算
2014/09/12 Python
Python基于pygame实现的弹力球效果(附源码)
2015/11/11 Python
Python使用asyncio包处理并发详解
2017/09/09 Python
对numpy Array [: ,] 的取值方法详解
2018/07/02 Python
对Python中的条件判断、循环以及循环的终止方法详解
2019/02/08 Python
python Manager 之dict KeyError问题的解决
2019/12/21 Python
pytorch如何冻结某层参数的实现
2020/01/10 Python
python 从list中随机取值的方法
2020/11/16 Python
一款利用纯css3实现的360度翻转按钮的实例教程
2014/11/05 HTML / CSS
浅谈CSS3中的变形功能-transform功能
2017/12/27 HTML / CSS
TobyDeals美国:在电子产品上获得最好的优惠和折扣
2019/08/11 全球购物
extern是什么意思
2016/03/10 面试题
30年同学聚会邀请函
2014/01/25 职场文书
人力资源经理的岗位职责范本
2014/02/28 职场文书
行政人事经理职位说明书
2014/03/05 职场文书
社区六一儿童节活动总结
2015/02/11 职场文书
医德医风个人总结
2015/02/28 职场文书
针对吵架老公保证书
2015/05/08 职场文书
狂人日记读书笔记
2015/06/30 职场文书
2015年暑期社会实践报告
2015/07/13 职场文书
2016年“抗战胜利纪念日”71周年校园广播稿
2015/12/18 职场文书