Добавьте строку с jquery в таблицу, которая построена в переменной

Question

Можно ли добавить некоторые строки и содержимое в таблицу, которая фактически построена в переменной?

Пример:

//This is the variable i'm talking about 
var table = "<table><tr><td>some content</td></tr></table>"; 

//What i want to do is some like this 
$(table).append("<tr><td>some more content</td></tr>"); 

$("body").append(table); 

поэтому выход должен быть как:

<table> 
    <tr> 
     <td>some content</td> 
    </tr> 
    <tr> 
     <td>some more content</td> 
    </tr> 
</table> 

Но мой выборочными выше, не похоже на работу.

Можно ли это сделать таким образом?

Я знаю, что я мог бы добавить таблицу сначала и добавить столбцы, но это не задача.

Answer 1

Проблема связана с тем фактом, что переменная таблицы является строкой, а не элементом DOM. Вы должны сделать это так:

var table = $('<table>'); 
table.append('<tr><td>some content</td></tr>') 
//What i want to do is some like this 
$(table).append("<tr><td>some more content</td></tr>"); 
$("body").append(table); 

Вот пример: http://jsfiddle.net/50mzw1h8/

Answer 2

Вам нужно сохранить результат $(table).append(...) переменной, а затем добавить, что к body:

var table = "<table><tr><td>some content</td></tr></table>"; 
var $table = $(table).append("<tr><td>some more content</td></tr>"); 
$("body").append($table); 

Example fiddle

Answer 3

Хранить обновленную таблицу в переменная, добавьте результат в тело.

$(document).ready(function() { 
 
    //This is the variable i'm talking about 
 
    var table = "<table><tr><td>some content</td></tr></table>"; 
 

 
    //Store result in a variable 
 
    var updatedTable = $(table).append("<tr><td>some more content</td></tr>"); 
 

 
    $("body").append(updatedTable); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 4

jQuery(document).ready(function() { 
    var table = "<table><tr><td>Content</td></tr></table>"; 
var AppendedTable = jQuery(table).append("<tr><td>Add content</td></tr>"); 
    jQuery("body").append(AppendedTable); 
}); 

Простой и легкий :)