jQuery_解析xml文件

最新推荐文章于 2021-08-06 02:29:36 发布

fightingcoder419

最新推荐文章于 2021-08-06 02:29:36 发布

阅读量485

点赞数 1

文章标签： jquery jQuery解析xml文件

本文链接：https://blog.csdn.net/fightingcoder419/article/details/52347685

版权

<?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" οnclick="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>