jquery - 如何使用 idref 解析 xml 元素

Question

给定一些示例data.xml文件：

<?xml version="1.0" encoding="utf-8"?>
<data>
    <categories>
        <category id="google">
            <name>Google</name>
        </category>
    <categories>
    <display>
        <categories>
            <category idref="google"/>
        </categories>
    </display>
</data>

还有一些用于获取data.xml文件的 jquery 代码：

$.ajax( {
    url: '/data.xml',
    dataType: 'xml',
    success: function( data )
    {
        $data = $( data );
        // fetch categories to display
        $categories = $data.find( 'display > categories > category' );
    }
} );

什么是一种有效且紧凑的方法来解析所category获取的元素$categories通过其idref属性引用的元素？

我想出了以下内容：

$categories.each( function() {
    var $category = $data.find( 'categories > category[id=' + $( this ).attr( 'idref' ) + ']' );
} );

但我认为可能有一种更紧凑的方式来收集元素。

Answer 1

您可以从属性创建id 选择器：idref

var referenced = $.unique($categories.map(function() {
    var $found = $data.find("#" + $(this).attr("idref"));
    return ($found.length ? $found[0] : null);
}).get());

上面的代码使用map()和$.unique()<category>来构建一个包含所有引用元素的唯一实例的数组。

Answer 2

var $data = $( data );
var $byId = {};

$("*[id]", $data).each(function () {
  var $this = $(this);
  $byId[ $this.attr("id") ] = $this;
});

// later...
$byId["google"].find("name");  //  <name>Google</name>