在jquery中处理带有命名空间的XML数据

最新推荐文章于 2023-08-09 09:49:58 发布

chen_xizhang

最新推荐文章于 2023-08-09 09:49:58 发布

阅读量905

点赞数

CC 4.0 BY-SA版权

分类专栏： [随笔分类]网络开发和设计 [发布至博客园首页] [随笔分类]网络开发和设计 [网站分类]jQuery 文章标签： jquery xml function jquery插件 div encoding

本文链接：https://blog.youkuaiyun.com/chen_xizhang/article/details/6554509

[随笔分类]网络开发和设计同时被 3 个专栏收录

90 篇文章

订阅专栏

[随笔分类]网络开发和设计

88 篇文章

订阅专栏

[发布至博客园首页]

69 篇文章

订阅专栏

本文介绍如何使用jQuery处理带有命名空间的XML数据。通过一个插件jquery.xmlns.js，可以轻松选择带命名空间的元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这一篇记录一个小技巧。

如果你在做AJAX应用，则你可能经常会用到jquery（或者其他框架）处理服务返回的数据。如果用Jquery处理Json格式，将是相当方便的。但不幸的是，很多服务返回的数据仍然是XML格式的。

jquery对于xml这种数据的处理是内置支持的，这一点没有任何问题。但前提是返回的数据没有带任何命名空间。例如下面这份数据


 "1.0" encoding="utf-8" ?>

  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">
  
  
  
   "1" firstName=
   "ares" lastName=
   "chen">

要处理这样的数据，jquery代码大致如下

            var div = $("#placeholder");

            

            // 处理不带命名空间的xml
            $.get("data.xml", null, function (data) {
                var employees = $("Employee", data); //找到所有的Employee节点

                var ul = $("
  
");

                employees.each(function () {
                    $("
").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);// 将每一行数据构造一个新的li标签，并且将其插入到ul中

                });

                ul.appendTo(div);
            });

但如果我们的XML数据带有命名空间，则上述代码就会无效。原因是因为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>

为了解决这个问题，有热心的网友，编写了一个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节点

                var ul = $("
  
");

                employees.each(function () {
                    $("
").text($(this).attr("firstName") + " " + $(this).attr("lastName")).appendTo(ul);

                });

                ul.appendTo(div);

            });

不得不说，XML这个技术规范中的命名空间真是一个很不好的设计。增加了很多麻烦，胜过于它带来的好处。

本文的例子完整代码如下

<%@ 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>