如何使用 jQuery 选择具有唯一文本内容的 XML 节点？答案

【问题标题】：How to use jQuery to select XML nodes with unique text content?如何使用 jQuery 选择具有唯一文本内容的 XML 节点？
【发布时间】：2010-02-09 20:55:24
【问题描述】：

我正在尝试“以 jQuery 方式”从 XML 文档中提取唯一文本条目的列表，但遇到了困难。

从此 XML：

<items>
  <item>
    <categories>
      <cat>Category 1</cat>
      <cat>Category 2</cat>
    </categories>
  </item>
  <item>
     <categories>
      <cat>Category 2</cat>
      <cat>Category 3</cat>
  </item>
 </items>

我想生成一个选择列表，例如：

<select>
 <option>Category 1</option>
 <option>Category 2</option>
 <option>Category 3</option>
</select>

到目前为止，我所有的尝试都产生了一个重复的“Category 2”选项节点。我尝试使用 $.unique() 方法，但结果让我认为它只是比较节点名称，而不是文本内容。这是我最新的hackery，但不起作用：

var filters = $("cat",xmldoc);
filters = $.unique(filters);
$(filters).each(function()
{
    $("select").append("<option>" + $(this).text() + "</option>");
});

我可以想出一些标准的 javascript 技巧来实现这一点，但我希望有一个漂亮、优雅的 jQuery 方法来实现这一点。

任何提示或技巧将不胜感激。

谢谢！

【问题讨论】：

标签： javascript jquery xml

【解决方案1】：

cat 元素不是重复的，因为它们具有相同的文本内容。它们仍然是具有自己不同身份的元素，因此unique 不会删除它们。

您必须改为将文本内容读入数组，然后从字符串数组中删除重复项。

不幸的是，你也不能在 Array-of-String 上使用unique，因为它只支持 DOM 元素项。

我只是在构建列表时进行重复删除：

var cats= [];
$('cat', xmldoc).each(function() {
    var text= $(this).text();
    if ($.inArray(text, cats)===-1)
        cats.push(text);
});

然后将每个选项添加到选择中：

$.each(cats, function() {
    $('select').append($('<option>').attr('val', this).attr('text', this));
});

需要使用attr 和not 设置选项文本，方法是将整个元素作为HTML 传递。当您从文本制作 HTML 时，您必须对注入 HTML 中的任何文本字符串进行 HTML 转义，否则您将有潜在的跨站点脚本安全漏洞。

【讨论】：

这与我的想法不谋而合。感谢您的确认.... inArray() 会的。 :)