копирование изображения из одной строки таблицы в другую таблицу с помощью jquery

Question

Я копирую содержимое из одной таблицы в другую следующим образом;

var ntr='',//to store html for new table row
rows=[],//to collect new rows
$tbl=$("#table_rolecart tbody"),//original table
l=$("tr", $tbl).length;
var row;
for(int i=0;i=0;i<l;){
        row=$("tr:eq("+i+")", $tbl);
  ntr= '<tr><td>'
  +$("td:nth-child(2)",row).text()+'<input type=hidden name="access_id" value='+accessid+'></td><td>'    //add item name
  +$("td:nth-child(3)",row).text()+'</td><td>'  //add description
  //want to add the third column which is an image with img tag
  + '</td></tr>'

В настоящее время я делаю как + row.find ("img.role-action"), где я хочу добавить столбец изображения, но в таблице вместо изображения отображается [Объект]. Как скопировать изображение в новую таблицу?

содержание оригинальной таблицы выглядит следующим образом

<table class="table sortable" id="table_rolecart">
    <tbody>
              <tr class="odd">
                  <td><a href="#"><img src="/gra/images/icons/fugue/cross-circle.png" class="move-row" alt="Remove"></a></td>
                  <td>agile_unix_role<input type="hidden" value="1101" name="role_id"></td>
                  <td>this agile unix role</td>
                  <td><img alt="add" src="/gra/images/icons/fugue/plus-circle.png" id="role_action" class="role_action"></td>
             </tr>
             <tr class="slider">
                  <td colspan="4"><div class="sliding">Business Justification:<input type="text" name="ar_businessjust"></div></td>
             </tr>
             <tr class="slider">
                  <td colspan="2"><div class="sliding">Start Date: <input type="text" id="ar_startdate" value=""></div></td> 
                  <td colspan="2"><div class="sliding">End Date: <input type="text" id="ar_enddate" value=""></div></td>
             </tr>
             <tr style="height:8px">
             </tr>
     </tbody>
</table>

Я хочу, чтобы все строки со всеми столбцами, кроме последней, были объединены в одну строку в целевой таблице в отдельные столбцы. Я получил это, единственное, что осталось, это изображение в 4-м столбце первой строки, которое мне нужно скопировать как последний столбец в целевую таблицу

Answer 1

Редактировать

Я неправильно понял ... это то, что вы хотите:

var html = $('<div>').append($('img.role-action').clone()).remove().html();

Выше приведен HTML-код для выбранного элемента изображения, включая сам элемент.

Answer 2

Вам нужно использовать $("td:nth-child(2)",row).html() вместо $("td:nth-child(2)",row).text()

Answer 3

Я не уверен, правильно ли я понимаю вашу проблему, но я думаю, что когда вы используете row.find ("img.role-action"), чтобы получить объект img, вы можете использовать следующее для печати изображения:

'<img src="'+row.find("img.role-action").attr("src")+'" />'

Может потребоваться добавить дополнительные атрибуты к тегу изображения в зависимости от того, что вы хотите.

Answer 4

Вы пытались использовать .html(), чтобы просто извлечь то, что находится внутри этой клетки?