XML获取正确的节点

时间:2013-06-13 22:06:08

标签: javascript jquery xml

我有两个div,我是从XML“Item”节点#Option_Base-Shirt和#Option_Open-Main-Fabric-Collar创建的。我希望这两个div由“Sub”div填充,所以#Base-Shirt将有一个sub div而#Option_Open-Main-Fabric-Collar将有两个sub div。目前,每个Item div都有三个子div。

XML

<Item name="None" title="Base-Shirt" alt="jpg">
  <Sub name="Pique" title="Open-Main-Fabric-Collar" alt="png"></Sub>
</Item>

<Item name="Pique" title="Open-Main-Fabric-Collar" alt="png">
  <Sub name="Jersey" title="Outside-Pocket-Left" alt="png"></Sub>
  <Sub name="Main" title="Pocket" alt="png"></Sub>
</Item>

的Javascript

//Add Subs to Option div
$(document).find("Sub").each(function(){
  for (var i=0; i<=NumberItems; i++) {
    $("#Option_"+ItemNames[i])
      .append('<div class="Sub" id="' + $(this)
      .attr('title') +'"></div>');
  }
});

我认为它应该是这样的,但是仍然会在每个项目div中放入所有三个div:

 //Add Subs to Option div
 $(document).find("Item").each(function(){
  for (var i=0; i<=NumberItems; i++) {
    $(this).find("Sub").each(function(){

            $("#Option_"+ItemNames[i]).append('<div class="Sub" id="' +   $(this).attr('title') +'"></div>');

    });
    }
});

获取XML:

$(document).ready(function(){
// Load XML
$.ajax({
    url: 'data.xml',
    dataType: "xml",
    success: parse,
    error: function(){alert("Error: Something wrong with XML");}
});

 function parse(document){

//Get all item names Var=ItemNames (Base_Shit, Collar...)
$(document).find("Item").each(function(){

1 个答案:

答案 0 :(得分:0)

这似乎有效我将函数放在我正在创建项目div的函数内。对不起,我可能没有很好地解释我的问题。

$(document).find("Item").each(function(){
    $(".Button").append('<div class="Item" id="' + $(this).attr('title') +'" name="' + $(this).attr('name') +'" alt="' + $(this).attr('alt') +'"><span>'+$(this).attr('title').replace(/\-/g, ' ')+'</span><div class="Fabric" id="Fabric_' + $(this).attr('title') +'"></div><div id="Option_' + $(this).attr('title') +'" class="Option"></div></div>');

    $(this).find("Sub").each(function(){
            $("#Option_"+$(this).parent().attr('title')).append('<div class="Sub" id="' + $(this).attr('title') +'"></div>');
    });


});