欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

在jquery中處理帶有命名空間的XML數(shù)據(jù)

 更新時間:2011年06月13日 23:55:41   作者:  
如果你在做AJAX應用,則你可能經(jīng)常會用到jquery(或者其他框架)處理服務返回的數(shù)據(jù)。如果用Jquery處理Json格式,將是相當方便的。
但不幸的是,很多服務返回的數(shù)據(jù)仍然是XML格式的。
jquery對于xml這種數(shù)據(jù)的處理是內(nèi)置支持的,這一點沒有任何問題。但前提是返回的數(shù)據(jù)沒有帶任何命名空間。例如下面這份數(shù)據(jù)
復制代碼 代碼如下:

<?xml version="1.0" encoding="utf-8" ?>
<data>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
<Employee id="1" firstName="ares" lastName="chen"></Employee>
</data>

要處理這樣的數(shù)據(jù),jquery代碼大致如下
復制代碼 代碼如下:

var div = $("#placeholder");
// 處理不帶命名空間的xml
$.get("data.xml", null, function (data) {
var employees = $("Employee", data); //找到所有的Employee節(jié)點
var ul = $("<ul />");
employees.each(function () {
$("<li />").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);// 將每一行數(shù)據(jù)構(gòu)造一個新的li標簽,并且將其插入到ul中
});
ul.appendTo(div);
});

但如果我們的XML數(shù)據(jù)帶有命名空間,則上述代碼就會無效。原因是因為jquery默認處理不了命名空間\
復制代碼 代碼如下:

<?xml version="1.0" encoding="utf-8" ?>
<data xmlns:d="http://tech.xizhang.com">
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
<d:Employee id="1" firstName="bill" lastName="gates"></d:Employee>
</data>

為了解決這個問題,有熱心的網(wǎng)友,編寫了一個jquery插件,叫做jquery.xmlns.js,有興趣可以通過下面了解和下載
http://www.rfk.id.au/blog/entry/xmlns-selectors-jquery/
那么,我們可以用如下的方法來解決問題
復制代碼 代碼如下:

$.xmlns["d"] = "http://tech.xizhang.com";
// 處理帶命名空間的xml
$.get("datawithnamespace.xml", null, function (data) {
var employees = $("d|Employee", data); //找到所有的Employee節(jié)點
var ul = $("<ul />");
employees.each(function () {
$("<li />").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);
});
ul.appendTo(div);
});

不得不說,XML這個技術(shù)規(guī)范中的命名空間真是一個很不好的設計。增加了很多麻煩,勝過于它帶來的好處。
本文的例子完整代碼如下
復制代碼 代碼如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery.xmlns.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(function () {
var div = $("#placeholder");
// 處理不帶命名空間的xml
$.get("data.xml", null, function (data) {
var employees = $("Employee", data); //找到所有的Employee節(jié)點
var ul = $("<ul />");
employees.each(function () {
$("<li />").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);// 將每一行數(shù)據(jù)構(gòu)造一個新的li標簽,并且將其插入到ul中
});
ul.appendTo(div);
});
$("<br />").appendTo(div);
$.xmlns["d"] = "http://tech.xizhang.com";
// 處理帶命名空間的xml
$.get("datawithnamespace.xml", null, function (data) {
var employees = $("d|Employee", data); //找到所有的Employee節(jié)點
var ul = $("<ul />");
employees.each(function () {
$("<li />").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);
});
ul.appendTo(div);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="placeholder">
</div>
</form>
</body>
</html>

最后,在瀏覽器中看到的效果如下。有圖有真相

image

相關文章

  • jQuery的鏈式調(diào)用淺析

    jQuery的鏈式調(diào)用淺析

    并不是所有的瀏覽器都暴露了dom的對象原型,所以不能通過簡單擴展原型方法并通過return this的形式來實現(xiàn)跨瀏覽器的鏈式調(diào)用,jquery采用了包裝器的方式來解決了這個問題。
    2010-12-12
  • jQuery超精致圖片輪播幻燈片特效代碼分享

    jQuery超精致圖片輪播幻燈片特效代碼分享

    這篇文章主要為大家詳細介紹了jQuery超精致圖片輪播幻燈片特效,圖片輪播效果特別適合做產(chǎn)品展示,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2015-09-09
  • jQuery 1.0.2

    jQuery 1.0.2

    jQuery 1.0.2...
    2006-10-10
  • jQuery Ajax 實例全解析

    jQuery Ajax 實例全解析

    jQuery確實是一個挺好的輕量級的JS框架,能幫助我們快速的開發(fā)JS應用,并在一定程度上改變了我們寫JavaScript代碼的習慣。
    2011-04-04
  • JQuery中解決重復動畫的方法

    JQuery中解決重復動畫的方法

    本篇文章主要介紹了JQuery中解決重復動畫的辦法,有分別有圖片滾動輪播,回到頁面頂部,聯(lián)級菜單滑出,手風琴等效果,有需要的朋友可以來看一下。
    2016-10-10
  • jquery編寫彈出信息提示條并延時滑出動畫實現(xiàn)示例

    jquery編寫彈出信息提示條并延時滑出動畫實現(xiàn)示例

    這篇文章主要為大家介紹了jquery編寫彈出信息提示條并延時滑出動畫實現(xiàn)示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-08-08
  • 使用jQuery內(nèi)容過濾選擇器選擇元素實例講解

    使用jQuery內(nèi)容過濾選擇器選擇元素實例講解

    內(nèi)容過濾選擇器:根據(jù)元素中的文字內(nèi)容或所包含的子元素特征獲取元素,其文字內(nèi)容可以模糊或絕對匹配進行元素定位,接下來為大家詳細介紹下jQuery選擇器,感興趣的朋友可以參考下哈
    2013-04-04
  • jquery刪除數(shù)組中重復元素

    jquery刪除數(shù)組中重復元素

    本文主要講解jquery刪除數(shù)組中重復元素的具體思路與示例代碼,有助于理解與學習,希望對大家有所幫助
    2016-12-12
  • jQuery實現(xiàn)雪花飄落效果

    jQuery實現(xiàn)雪花飄落效果

    這篇文章主要為大家詳細介紹了jQuery實現(xiàn)雪花飄落效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-08-08
  • jquery的Tooltip插件 qtip使用詳細說明

    jquery的Tooltip插件 qtip使用詳細說明

    qTip是一個基于JQuery的Tooltip插件。它幾乎支持所有的主流瀏覽器。
    2010-09-09

最新評論