jQuery закрытие открытых тегов

Question

При попытке проанализировать XML-файл в табличном формате, JQuery продолжает закрывать мое открытие <tr> тег. Есть ли обходной путь для этого?

<script type="text/javascript">
    $(document).ready(function(){
    $.ajax({
            type: "GET",
            url: "sample-data.xml",
            dataType: "xml",
            success: parseXml
        });
    }); 

    function parseXml(xml)
    {
      $(xml).find("user").each(function()
      {  
        var id = "#sortable";  
            $(id).append("<tr>");
            $(id).append("<td>" + $(this).find("name").text() + "</td>");
            $(id).append("</tr>");

      });
    }
</script>

<table id="table" class="tablesorter">
    <thead>
      <tr>
        <th>test</th>
      </tr>
    </thead>
    <tbody id="sortable">

    </tbody>
</table>

Вот как выводится разметка:

 <tr></tr>
 <td>data</td>

Answer 1

Да, JQuery на самом деле не работает. Попробуй это:

function parseXml(xml)
{
  $(xml).find("user").each(function()
  {  
    var id = "#sortable";  
        $(id).append('<tr></tr>');
        $(id).find('tr:last').html("<td>" + $(this).find("name").text() + "</td>");

  });
}

Answer 2

Просто вызовите 1 append вместо нескольких добавлений.

Изменить эту часть:

        $(id).append("<tr>");
        $(id).append("<td>" + $(this).find("name").text() + "</td>");
        $(id).append("</tr>");

к этому:

        $(id).append("<tr><td>" + $(this).find("name").text() + "</td></tr>");

Answer 3

Я бы посоветовал не использовать append в цикле. Вместо этого выведите его за пределы цикла.

var id = $("#sortable");
var html = '';

  $(xml).find("user").each(function()
  {  

    html += '<tr>';
      html += '<td>';
          html += $(this).find("name").text( );
      html += '</td>';
    html += '</tr>';   
  });

  id.append(html);

В случаях, когда вы собираетесь использовать $(this), много раз внутри цикла, например, для возраста, пола и т. Д., Я предлагаю вам присвоить переменную $ (this) вместо того, чтобы вызывать $ (this) снова и снова.

PS Я не тестировал этот код, просто хочу что-то предложить... но надеюсь, что он работает. Ура ^^

Answer 4

Я не думаю, что jQuery является виновником здесь.

Когда вы звоните append("<tr>")что ты хочешь сделать? Ответ: Вы хотите изменить DOM согласно вашей спецификации. Но DOM - это структура данных, а не строка. Вы не можете добавить "незакрытый" элемент в DOM, поэтому все элементы по сути закрыты в момент их добавления.

В результате последующее append("<td>...</td>") добавляет элемент TD после <tr> а не внутри него. Кроме того, любая попытка append("</tr>") просто игнорируется, так как это было бы довольно бессмысленно, учитывая обработку append("<tr>"),