chobo2
chobo2

Reputation: 85835

how to remove an html img from a table with javascript/jquery

I have a table and I use jquery to get all the cells from each row. Some of these cells have text and a image in them.

I want to grab the td cell(I have done this) then remove the image from these cells in memory(I don't want to remove them from the actual table).

so my cell would look like this

<td>hi their <img...... /> </td> I grab this with jquery and I get the dom back now I don't know how to remove the image tag.

so I want

var hold = // something to remove the img

alert(hold) produced:  "hi their".

Edit

here is what I have

<table id="tbl">
  <thead>
  <th> checkbox </th>
  <th>header 1 </th>
    <th>header 2 </th>
    </thead>
  <tfoot>
  </tfoot>
  <tbody>
    <tr>
      <td>checkbox </td>
      <td>hi there woot</td>
      <td>still no image </td>
    </tr>
    <tr>
      <td>checkbox </td>
      <td>a image is coming </td>
      <td> here is the image <img alt="" src="" class="imgClass" </td>
    </tr>
  </tbody>
</table>



var rowCells = $('#tbl :checked').parents('tr td');

var header2 = $(rowCells[2]).html() // grabs "still no image" and "here is the image <img ....."/>

so I tried like replace and stuff and nothihg as worked.

I want header2 variable to just have "here is the iamge"

Upvotes: 0

Views: 3238

Answers (2)

meder omuraliev
meder omuraliev

Reputation: 186652

Updated answers:

var header2 = $(rowCells[2]).html().replace(/<img[^>]+>/g, '');
var header2 = $(rowCells[2]).html().find('img').remove()

Untested:

var hold = $('td:first').html().replace(/<img[^>]+>/g, '');
alert( hold );

Alternative way using clones:

var hold = $('td:first').clone().find('img').remove().end()

Upvotes: 1

RaYell
RaYell

Reputation: 70424

Try this:

var tdContent = $('td').clone();
tdContent.children('img').remove();
alert(tdContent.html());

This will clone the DOM element in the memory which you can then strip of img tags.

Upvotes: 0

Related Questions