使用jquery解析XML的方法
更新時(shí)間：2014年09月05日 12:02:58 投稿：shichen2014
這篇文章主要介紹了使用jquery解析XML的方法,代碼簡潔實(shí)用,需要的朋友可以參考下
本文實(shí)例講述了使用jquery解析XML的方法，分享給大家供大家參考之用。具體方法如下：
一、xml文件結(jié)構(gòu):books.xml
<?xml version="1.0" encoding="UTF-8"?> <root> <book id="1"> <name>深入淺出extjs</name> <author>張三</author> <price>88</price> </book> <book id="2"> <name>鋒利的jQuery</name> <author>李四</author> <price>99</price> </book> <book id="3"> <name>深入淺出flex</name> <author>王五</author> <price>108</price> </book> <book id="4"> <name>java編程思想</name> <author>錢七</author> <price>128</price> </book> </root>
二、頁面代碼:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jquery解析xml</title>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
$.post('books.xml',function(data){
//查找所有的book節(jié)點(diǎn)
var s="";
$(data).find('book').each(function(i){
var id=$(this).attr('id');
var name=$(this).children('name').text();
var author=$(this).children('author').text();
var price=$(this).children('price').text();
s+=id+" "+name+" "+author+" "+price+"<br>";
});
$('#mydiv').html(s);
});
});
</script>
</head>
<body>
<div id='mydiv'></div>
</body>
</html>
運(yùn)行效果圖如下:
感興趣的讀者可以點(diǎn)此本站下載完整代碼。
更多關(guān)于jquery xml操作相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery操作xml技巧總結(jié)》
您可能感興趣的文章:
- jQuery 解析xml文件
- JQuery解析HTML、JSON和XML實(shí)例詳解
- jQuery+ajax讀取并解析XML文件的方法
- jQuery 行級解析讀取XML文件（附源碼）
- JQuery解析XML數(shù)據(jù)的幾個(gè)簡單實(shí)例
- jquery解析XML字符串和XML文件的方法說明
- jQuery解析返回的xml和json方法詳解
- 用JQuery 實(shí)現(xiàn)AJAX加載XML并解析的腳本
- Jquery Ajax解析XML數(shù)據(jù)(同步及異步調(diào)用)簡單實(shí)例
- JQuery解析XML的方法小結(jié)
- jQuery實(shí)現(xiàn)的解析本地 XML 文檔操作示例
相關(guān)文章
這篇文章主要介紹了JS彈出層的絕對定位居中是如何實(shí)現(xiàn)的,需要的朋友可以參考下2014-02-02
如何獲取select下拉框的值(option沒有及有value屬性)
獲取select下拉框的值分為option沒有value屬性及有value屬性時(shí)的兩種情況，下面分別給出具體的實(shí)現(xiàn)代碼，需要的朋友可以參考下2013-11-11
這篇文章主要為大家詳細(xì)介紹了原生js滑動(dòng)輪播封裝，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-07-07
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)彈幕墻效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
JavaScript+html5 canvas繪制漸變區(qū)域完整實(shí)例
這篇文章主要介紹了JavaScript+html5 canvas繪制漸變區(qū)域的方法,結(jié)合完整實(shí)例形式分析了canvas顏色調(diào)用與圖形繪制的相關(guān)技巧,需要的朋友可以參考下2016-01-01
JavaScript探測CSS動(dòng)畫是否已經(jīng)完成的方法
這篇文章主要為大家詳細(xì)介紹了JavaScript探測CSS動(dòng)畫是否已經(jīng)完成的方法，感興趣的小伙伴們可以參考一下2016-08-08
下面小編就為大家?guī)硪黄獙SON字符串轉(zhuǎn)換成Map對象的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11
js+canvas實(shí)現(xiàn)轉(zhuǎn)盤效果（兩個(gè)版本）
這篇文章主要為大家詳細(xì)介紹了兩個(gè)版本的js+canvas實(shí)現(xiàn)轉(zhuǎn)盤效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-09-09
JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之二叉樹遍歷算法詳解【先序、中序、后序】
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之二叉樹遍歷算法,結(jié)合實(shí)例形式詳細(xì)分析了javascript二叉樹的定義及先序遍歷、中序遍歷、后序遍歷等相關(guān)遍歷操作實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-02-02
瀏覽器兼容的JS寫法總結(jié)，涵蓋的內(nèi)容很全面，感興趣的小伙伴們可以參考一下2016-04-04