JQuery解析XML數(shù)據(jù)的幾個簡單實例
用JavaScript解析XML數(shù)據(jù)是常見的編程任務(wù),JavaScript能做的,JQuery當然也能做。下面我們來總結(jié)幾個使用JQuery解析XML的例子。
第一種方案:
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: 'http://www.dhdzp.com/cgi/test.xml',
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('<li><a href="'+links+'">'+titles+'</a></li>');
});
}
});
})
</script>
<div id="noticecon">
<ol>
</ol>
</div>
第二種方案:
<script type="text/javascript">
$.get("http://www.dhdzp.com/cgi/test.xml", 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('<li><a href="'+links+'">'+titles+'</a></li>');
})
});
</script>
<div id="noticecon">
<ol>
</ol>
</div>
一般步驟如下:
1. 讀取xml文件
$.get("xmlfile.xml",function(xml){
//xml即為可以讀取使用的內(nèi)容,具體讀取見第2點
});
2. 讀取xml內(nèi)容
如果讀取的xml是來于xml文件,這結(jié)合上面的那點,處理如下:
$.get("xmlfile.xml",function(xml){
$(xml).find("item").length;
});
如果讀取的是xml字符串,則要注意一點,xml字符串的必然被"<xml>"和"</xml>"包圍才可以被解析
$("<xml><root><item></item></root></xml>").find("item").length;
解析xml內(nèi)容:
示例xml:
<?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> </fields>
以下是解析示例代碼:
$(xml).find("field").each(function() {
var field = $(this);
var fName = field.attr("Name");//讀取節(jié)點屬性
var dataType = field.find("datatype").text();//讀取子節(jié)點的值
});
以上這篇JQuery解析XML數(shù)據(jù)的幾個簡單實例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
使用JQUERY進行后臺頁面布局控制DIV實現(xiàn)左右式
一個網(wǎng)站的后臺使用frame框架來實現(xiàn)這種形式,這邊作者不是使用的frame而是純div進行布局,下面看下具體的實現(xiàn)代碼2014-01-01
JQuery操作Select的Options的Bug(IE8兼容性視圖模式)
JQuery在IE8兼容性視圖模式下操作Select的Options的Bug在本文進行重現(xiàn)并給出詳細的解決方法,感興趣的朋友可以參考下哈,希望對你有所幫助2013-04-04
jQuery中animate()的使用方法及解決$(”body“).animate({“scrollTop”:top})
這篇文章主要介紹了關(guān)于jQuery中animate()的使用方法及解決$("body").animate({"scrollTop":top})不被Firefox支持的問題,文中介紹的非常詳細,相信對大家具有一定的參考價值,需要的朋友們下面來一起看看吧。2017-04-04
jQuery Validation Engine驗證控件調(diào)用外部函數(shù)驗證的方法
這篇文章主要介紹了jQuery Validation Engine驗證控件調(diào)用外部函數(shù)驗證的方法,需要的的朋友參考下吧2017-01-01
js制作帶有遮罩彈出層實現(xiàn)登錄注冊表單特效代碼分享
這篇文章主要為大家詳細介紹了js制作帶有遮罩彈出層實現(xiàn)登錄注冊表單代碼特效,推薦給大家,有需要的小伙伴可以參考下。2015-09-09
Html5的placeholder屬性(IE兼容)實現(xiàn)代碼
Placeholder是HTML5新增的另一個屬性,當input或者textarea設(shè)置了該屬性后,該值的內(nèi)容將作為灰字提示顯示在文本框中,當文本框獲得焦點時,提示文字消失。以前要實現(xiàn)這效果都是用JavaScript來控制才能實現(xiàn) , firefox、google chrome等表示對其支持 , 唯獨IE不支持2014-08-08

