您的位置：首页 > Web前端 > JQuery

jQuery_解析xml文件

2016-08-28 20:52 369 查看

<?xml version="1.0" encoding="utf-8" ?>
<fields>
<field Name="Name1">
<fieldname>dsname</fieldname>
<datatype>字符</datatype>
</field>
<field Name="Name2">
<fieldname>dstype</fieldname>
<datatype>字符</datatype>
</field>
<field Name="Name3">
<fieldname>域名</fieldname>
<datatype>类型</datatype>
</field>
</fields>

Ajax&jQuery第一种方案解析xml代码如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#log{
width:600px;
height:400px;
border:solid 1px black;
}
</style>
<script src="js/jquery-1.11.3.min.js"></script>
</head>
<body>
<div id="log"></div>
<input type="button" value="添加" id="btn" onclick="log(this.value)" />
</body>
<script>
$(function(){
$.get("field.xml", function(data){
$(data).find('fields').find('field').each(function(index, ele){
var filename= $(ele).attr("Name");//读取节点属性
log(filename);
//alert(filename);
var fName = $(ele).find('fieldname').text();<span style="font-size: 14px; line-height: 20px; font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">//读取子节点的值</span>

log(fName);
//alert(fName);
var dataType = $(ele).find('datatype').text();
//alert(dataType)
log(dataType);
//log(filename"---"+fNmae+"----"+dataType);
});
});
});
//创建日志
function log(txt){
$("#log").html(txt+"<br/>"+$("#log").html());
}
</script>
</html>

如果读取的是xml字符串，则要注意一点，xml字符串的必然被"<xml>"和"</xml>"包围才可以被解析

$("<xml><root><item></item></root></xml>").find("item").length;

如果读取的xml是来于xml文件，这结合上面的那点，处理如下：

$.get("xmlfile.xml",function(xml){
$(xml).find("item").length;
});

Ajax&jQuery解析xml第二种方案

$(function(){
$(document).ready(function() {
<span style="white-space:pre"> </span>$.ajax({
url: 'field.xml',
dataType: 'xml',
success: function(data){
$(data).find("fields").find("field").each(function(index, ele) {
var filename=$(ele).attr("Name");
log(filename)
var fName = $(ele).find("fieldname").text();
log(fName);
var fType = $(ele).find("datatype").text();
log(fType);
});
}
});
});<span style="font-family: tahoma, arial, 宋体; line-height: 25.2px;">});</span>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： jquery jQuery解析xml文件

相关文章推荐

新的分享

章节导航