jQuery Вывод повторяющихся дочерних узлов XML Неправильно

Question

Я использую jQuery для синтаксического анализа и вывода XML. У меня есть вложенный цикл для вывода всех дочерних элементов TASKS, но каждая итерация выводит сразу сразу всех потомков, а не по одному на строку.

<xml version="1.0"> 
<choices> 
    <choice id="1" name="Type 1"> 
     <description> 
      Example a 
     </description> 
     <tasks> 
      <task>Do this</task> 
      <task>Do that</task> 
     </tasks> 
    </choice> 
    <choice id="2" name="Type 2"> 
     <description> 
      Example b 
     </description> 
     <tasks> 
      <task>Do other</task> 
      <task>Do something</task> 
     </tasks> 
    </choice> 
</choices> 

Мой сценарий:

$(function(){ 
     "use strict"; 
//Above XML content is being passed as a string for this example 
     var str = "<xml version='1.0'><choices><choice id=\"1\" name=\"Type 1\"><description>Example a</description><tasks><task>Do this</task><task>Do that</task></tasks></choice><choice id=\"2\" name=\"Type 2\"><description>Example b</description><tasks><task>Do other</task><task>Do something</task></tasks></choice></choices></xml>"; 
     var xmlDoc = $.parseXML(str); 
     var $xml = $(xmlDoc); 

     var temp = {}; 

     $xml.find('choice').each(function() { 
      var $this = $(this); 
      temp.id = $this.attr('id'); 
      temp.title = $this.attr('name'); 
      temp.description = $this.find('description').text(); 
      temp.choices = []; 

      var counter = 0; 

      $this.find('tasks').eq(counter).each(function(index, child) { 

       document.write($(child).find("task").text() + counter + "<br>"); 
       counter++; 
      }); 


     }); 

    }); 

Выход я хочу видеть детей задач:

Do this0 
Do that1 
Do other2 
Do something3 

Выходной сигнал Сейчас я видел:

Do thisDo that0 
Do otherDo something0 

Answer 1

Если все, что вам нужно сделать, это распечатать задания, это c быть значительно упрощена только это:

$xml.find('task').each(function (i) { 
    document.write($(this).text() + i + "<br>"); 
}); 

JSFiddle

---

Если вам нужен цикл choice делать другие вещи, которые вы только что вышли из этого вопроса, вы можете изменить свой цикл задач для этого :

 $this.find('task').each(function() { 

      document.write($(this).text() + counter + "<br>"); 
      counter++; 
     }); 

и переместить counter декларацию выше choice петли

JSFiddle
(проверьте консоль в jsfiddle, изменить console.log назад document.write в Вашем коде)

, приведенный выше цикл будет через все task тегов в пределах текущего choice тега.

Если вы просто хотите посмотреть на детей tasks, независимо от тега. Вы можете сделать:

$this.find('tasks').children().each(function() { ... 

Если вы хотите, чтобы убедиться, что вы найти только task детей tasks, вы можете сделать это:

$this.find('tasks').children("task").each(function() { 

Все 3 выше, будут иметь тот же результат с вашим текущий xml, хотя (это ваш ожидаемый результат).

---

Проблема заключалась в том, что вы отыскания «задачи» вместо каждого отдельного «задачи» в вашем each() цикле и получить текст из всех task тегов внутри него. Вместо этого перебирайте каждую отдельную задачу.

Для дальнейшего сломать то, что исходный код делает ...

var counter = 0; 
//find the first `tasks` element within `$this`, then loop through it (the single item first task) 
$this.find('tasks').eq(counter).each(function(index, child) { 
      //find all the text within all the `task` tags. put 0 and a <br> after 
      document.write($(child).find("task").text() + counter + "<br>"); 
      //increment counter, doesn't matter since this block of code will only be ran once 
      counter++; 
     });