正文
xmljquery的简单介绍
小程序：扫一扫查出行【扫一扫了解最新限行尾号】
复制小程序
jquery与xml的问题
jquery官网有个plugin把string转化成xml的
jQuery.createXMLDocument = function(string){
var browserName = navigator.appName;
var doc;
if (browserName == 'Microsoft Internet Explorer'){
doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = 'false'
doc.loadXML(string);
} else {
doc = (new DOMParser()).parseFromString(string, 'text/xml');
}
return doc;
}
把json中的对应内容先转成xml如下
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
title无标题文档/title
/head
style
.backcolor {
background-color:#00CCCC;
}
.hover {
background-color:#FF6600;
}
/style
script src="js/jquery-1.4.4.js" language="javascript" type="text/javascript"/script
script language="javascript" type="text/javascript"
$(document).ready(function(){
$.getJSON("url", function(data){
var doc = $.createXMLDocument(data.msg);
$("li/li")
.html($(doc).find("prov").attr("text"))
.appendTo("#dmsg ul");
$(doc).find("county").each(function(){
var county = $(this).attr("text");
$("li/li")
.html(county)
.appendTo("#dmsg ul");
});
});
});
jQuery.createXMLDocument = function(string){
var browserName = navigator.appName;
var doc;
if (browserName == 'Microsoft Internet Explorer'){
doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = 'false'
doc.loadXML(string);
} else {
doc = (new DOMParser()).parseFromString(string, 'text/xml');
}
return doc;
}
/script
body
div id="dmsg"
ul/ul
/div
/body
/html
假设json数据如下
{"msg":"prov state=\"checked\" id=\"110000\" text=\"北京市\"city state=\"checked\" id=\"110100\" text=\"市辖区\"county state=\"checked\" id=\"110101\" text=\"东城区\"/county state=\"checked\" id=\"110102\" text=\"西城区\"//city/prov"}
JQuery 如何增删改 XML
1.通过jquery的$.ajax()请求该xml资源，里面参数dataType:xml，如此，即可在本地js代码上遍历此xml文档。把文件显示于页面。做了修改，删除操作后，把数据用JSON方式传递到后台，进行文件读写操作。
$.ajax({
url : rootPath + "/xml.php?act=read",
dataType : "json",
success : function(response) {
if (response) {
alert("保存成功");
}
else
alert("保存失败" );
}
}
});
xml文件\内容读取
1、读取xml文件
$.get("xmlfile.xml",function(xml){
//xml即为可以读取使用的内容，具体读取见第2点
});
2、读取xml内容
如果读取的xml是来于xml文件，这结合上面的那点，处理如下
$.get("xmlfile.xml",function(xml){
$(xml).find("item").length;
});
如果读取的是xml字符串，则要注意一点，xml字符串的必然被”xml”和”/xml”包围才可以被解析
$("xmlrootitem/item/root/xml").find("item").length; 二、解析xml内容示例xml：?xml version="1.0" encoding="utf-8" ?fields
field Name="Name1"
fieldnamedsname/fieldname
datatype字符/datatype
/field
field Name="Name2"
fieldnamedstype/fieldname
datatype字符/datatype
/field/fields以下是解析示例代码$(xml).find("field").each(function() {
var field = $(this);
var fName = field.attr("Name");//读取节点属性
var dataType = field.find("datatype").text();//读取子节点的值
});
另外说明一点js是没有权限去直接操作本地或者服务器的xml文件的，要通过 ActiveX来实现，这个涉及到浏览器安全的。
JQuery解析XML数据的几个简单实例
用JavaScript解析XML数据是常见的编程任务，JavaScript能做的，JQuery当然也能做。下面我们来总结几个使用JQuery解析XML的例子。
第一种方案：
script
type="text/javascript"
$(document).ready(function()
{
$.ajax({
url:
'',
dataType:
'xml',
success:
function(data){
//console.log(data);
$(data).find("channel").find("item").each(function(index,
ele)
{
var
titles
=
$(ele).find("title").text();
var
links
=
$(ele).find("link").text();
console.log(titles+'-----');
$("#noticecon").find('ol').append('lia
href="'+links+'"'+titles+'/a/li');
});
}
});
})
/script
div
id="noticecon"
ol
/ol
/div
第二种方案：
script
type="text/javascript"
$.get("",
function(data){
$(data).find('channel').find('item').each(function(index,
ele){
var
titles
=
$(ele).find('title').text();
var
links
=
$(ele).find('link').text();
$("#noticecon").find('ol').append('lia
href="'+links+'"'+titles+'/a/li');
})
});
/script
div
id="noticecon"
ol
/ol
/div
一般步骤如下：
1.
读取xml文件
$.get("xmlfile.xml",function(xml){
//xml即为可以读取使用的内容，具体读取见第2点
});
2.
读取xml内容
如果读取的xml是来于xml文件，这结合上面的那点，处理如下：
$.get("xmlfile.xml",function(xml){
$(xml).find("item").length;
});
如果读取的是xml字符串，则要注意一点，xml字符串的必然被"xml"和"/xml"包围才可以被解析
$("xmlrootitem/item/root/xml").find("item").length;
解析xml内容：
示例xml：
?xml
version="1.0"
encoding="utf-8"
?
fields
field
Name="Name1"
fieldnamedsname/fieldname
datatype字符/datatype
/field
field
Name="Name2"
fieldnamedstype/fieldname
datatype字符/datatype
/field
/fields
以下是解析示例代码：
$(xml).find("field").each(function()
{
var
field
=
$(this);
var
fName
=
field.attr("Name");//读取节点属性
var
dataType
=
field.find("datatype").text();//读取子节点的值
});
以上这篇JQuery解析XML数据的几个简单实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
jQuery读取XML文件的方法示例
本文实例讲述了jQuery读取XML文件的方法。分享给大家供大家参考，具体如下：
?xml
version="1.0"
encoding="utf-8"
?
taxrates
taxrate
id="1"
lower0/lower
upper500/upper
rate5/rate
buckle0/buckle
/taxrate
taxrate
id="2"
lower500/lower
upper2000/upper
rate10/rate
buckle25/buckle
/taxrate
taxrate
id="3"
lower2000/lower
upper5000/upper
rate15/rate
buckle125/buckle
/taxrate
taxrate
id="4"
lower5000/lower
upper20000/upper
rate20/rate
buckle375/buckle
/taxrate
taxrate
id="5"
lower20000/lower
upper40000/upper
rate25/rate
buckle1375/buckle
/taxrate
taxrate
id="6"
lower40000/lower
upper60000/upper
rate30/rate
buckle3375/buckle
/taxrate
taxrate
id="7"
lower60000/lower
upper80000/upper
rate35/rate
buckle6375/buckle
/taxrate
taxrate
id="8"
lower80000/lower
upper100000/upper
rate40/rate
buckle10375/buckle
/taxrate
taxrate
id="9"
lower100000/lower
upper99999999/upper
rate45/rate
buckle15375/buckle
/taxrate
/taxrates
function
StandardTaxRate()
{
$.ajax({
url:
"/Resource/salaryTaxRate.xml",
dataType:
'xml',
type:
'GET',
timeout:
2000,
error:
function(xml)
{
alert("加载XML
文件出错！");
},
success:
function(xml)
{
$(xml).find("taxrate").each(function(i)
{
var
oid
=
$(this).attr("id");
var
lower
=
$(this).children("lower").text();
var
upper
=
$(this).children("upper").text();
var
rate
=
$(this).children("rate").text();
var
buckle
=
$(this).children("buckle").text();
///后续操作。。。
});
}
});
}
PS：这里再为大家提供几款关于xml操作相关在线工具供大家参考使用：
在线XML/JSON互相转换工具：
在线格式化XML/在线压缩XML：
XML在线压缩/格式化工具：
xml代码在线格式化美化工具：
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery操作xml技巧总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
