jquery附加问题

Question

我收到此代码的附加问题。在我的xml中我去了2没有。 “listgroup”和jquery打印推进器。但在earch“listgroup”中，第一组包含6个点，第二组包含6个点。这两部分必须分别打印到'ul'元素。

但是我的问题是第一次，它在第一次打印时我自己打印了12个点并且它打印到第二次推进的6品脱..

我想要的是，第一个ul必须有6个点，第二个有点6个点在xml树中......

$(function(){
    $.get('career-utility.xml',function(myData){

    $(myData).find('listgroup').each(function(index){
          var listGroup = $(this);
          var listGroupTitle = $(this).attr('title');
          var shortNote =   $(this).attr('shortnote');
          var subLink   = $(this).find('sublist');
          var firstList = $(this).find('list');

          $('.grouplist').append('<div class="list-group"><h3>'+listGroupTitle+'</h3><ul class="level">'+index+'</ul></div>');

         $(this).children().each(function(num){
            var text = $(this).text();
            $('<li>'+text+'</li>').appendTo('ul.level');
        })
    })

    })    
})

Answer 1

修改

请参阅下面的修改，但您可能尝试更改每个class的{​​{1}}属性。如果是这种情况，您需要这样做：

- ＆GT;向右滚动可查看正在使用索引号更新的班级 - ＆gt;

ul.level

然后这个：

$('.grouplist').append('<div class="list-group"><h3>'+listGroupTitle+'</h3><ul class="level' + index + '"></ul></div>');

我认为我使用的第一种方法可能更好，除非您打算将这些类用作标识符。

---

<强>原始

您要将$('<li>'+text+'</li>').appendTo('ul.level' + index); 附加到.children()的每个实例，因此第二次，您创建的第一个实例再次接收子项。

您需要引用每个新创建的ul.level，然后附加到该页面。

<ul>

---

编辑：问题详细解释。

第一次通过

将新容器附加到文档中。

$(function(){
    $.get('career-utility.xml',function(myData){

    $(myData).find('listgroup').each(function(index){
          var listGroup = $(this);
          var listGroupTitle = $(this).attr('title');
          var shortNote =   $(this).attr('shortnote');
          var subLink   = $(this).find('sublist');
          var firstList = $(this).find('list');

          var $newElement = $('<div class="list-group"><h3>'+listGroupTitle+'</h3><ul class="level">'+index+'</ul></div>');
          var $newUL = $newElement.find('ul.level');

         $(this).children().each(function(num){
            var text = $(this).text();
            $newUL.append('<li>'+text+'</li>');
        });

        $('.grouplist').append( $newElement );
    })

    })    
})

然后你追加孩子：

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0</ul>
</div>

第二次通过

将新容器附加到文档中。

<div class="list-group">
    <h3>first title</h3>
    <ul class="level">0
        <li>first pass - first child</li>
        <li>first pass - second child</li>
        <li>first pass - third child</li>
        <li>first pass - fourth child</li>
        <li>first pass - fifth child</li>
        <li>first pass - sixth child</li>
    </ul>
</div>

然后您追加孩子，但请注意您的选择器为<div class="list-group"> <h3>first title</h3> <ul class="level">0 <li>first pass - first child</li> <li>first pass - second child</li> <li>first pass - third child</li> <li>first pass - fourth child</li> <li>first pass - fifth child</li> <li>first pass - sixth child</li> </ul> </div> <div class="list-group"> // New Container here <h3>second title</h3> <ul class="level">1</ul> </div> ，因此您要追加 <{1}}的两个实例：

ul.level