JQuery解析XML數(shù)據(jù)的幾個(gè)簡(jiǎn)單實(shí)例
用JavaScript解析XML數(shù)據(jù)是常見的編程任務(wù),JavaScript能做的,JQuery當(dāng)然也能做。下面我們來總結(jié)幾個(gè)使用JQuery解析XML的例子。
第一種方案:
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: 'http://www.dbjr.com.cn/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.dbjr.com.cn/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點(diǎn)
});
2. 讀取xml內(nèi)容
如果讀取的xml是來于xml文件,這結(jié)合上面的那點(diǎn),處理如下:
$.get("xmlfile.xml",function(xml){
$(xml).find("item").length;
});
如果讀取的是xml字符串,則要注意一點(diǎn),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é)點(diǎn)屬性
var dataType = field.find("datatype").text();//讀取子節(jié)點(diǎn)的值
});
以上這篇JQuery解析XML數(shù)據(jù)的幾個(gè)簡(jiǎn)單實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
- jQuery 解析xml文件
- JQuery解析HTML、JSON和XML實(shí)例詳解
- jQuery+ajax讀取并解析XML文件的方法
- 使用jquery解析XML的方法
- jQuery 行級(jí)解析讀取XML文件(附源碼)
- jquery解析XML字符串和XML文件的方法說明
- jQuery解析返回的xml和json方法詳解
- 用JQuery 實(shí)現(xiàn)AJAX加載XML并解析的腳本
- Jquery Ajax解析XML數(shù)據(jù)(同步及異步調(diào)用)簡(jiǎn)單實(shí)例
- JQuery解析XML的方法小結(jié)
- jQuery實(shí)現(xiàn)的解析本地 XML 文檔操作示例
相關(guān)文章
JQuery 改變頁面字體大小的實(shí)現(xiàn)代碼(實(shí)時(shí)改變網(wǎng)頁字體大小)
分別定義三個(gè)class為increaseFont、decreaseFont、resetFont 的元素。為其click事件添加事件2012-03-03
jQuery EasyUI API 中文文檔 - Pagination分頁
jQuery EasyUI API 中文文檔 - Pagination分頁,使用jQuery EasyUI的朋友可以參考下。2011-09-09
jQuery異步上傳文件插件ajaxFileUpload詳細(xì)介紹
這篇文章主要介紹了jQuery異步上傳文件插件ajaxFileUpload詳細(xì)介紹,本文首先講解了ajaxFileUpload的參數(shù)、錯(cuò)誤提示等知識(shí),然后給出了簡(jiǎn)單使用實(shí)例和ASP.NET MVC模式下的使用實(shí)例,需要的朋友可以參考下2015-05-05
解決jquery操作checkbox火狐下第二次無法勾選問題
在工作中使用jquery操作checkbox,進(jìn)行全選、反選,現(xiàn)在的問題是火狐下第二次無法勾選問題,在下面有個(gè)詳細(xì)的解答,感興趣的朋友可以參考下2014-02-02
jquery實(shí)現(xiàn)簡(jiǎn)單的自動(dòng)播放幻燈片效果
這篇文章主要介紹了jquery實(shí)現(xiàn)簡(jiǎn)單的自動(dòng)播放幻燈片效果,較為詳細(xì)的介紹了html頁面布局、css樣式設(shè)置及jQuery控制自動(dòng)播放幻燈的相關(guān)技巧,需要的朋友可以參考下2015-06-06
多種JQuery循環(huán)滾動(dòng)文字圖片效果代碼
這篇文章主要為大家提供了多種JQuery循環(huán)滾動(dòng)文字圖片效果代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-02-02

