我有以下HTML表格:
<div class="someClass" id="someID">
<!-- Move all images inside the td's here -->
<table cellspacing="0" cellpadding="0" style="width:100%;border-collapse:collapse;" id="mainTable">
<tbody>
<tr>
<td align="center">
<img width="127" height="191" border="0" src="Images/9.jpg" class="bvz_beeldthumb">
</td>
<td align="center">
<img width="127" height="191" border="0" src="Images/10.jpg" class="bvz_beeldthumb">
</td>
</tr>
<tr>
<td align="center">
<img width="127" height="191" border="0" src="Images/11.jpg" class="bvz_beeldthumb">
</td>
<td align="center">
<img width="127" height="191" border="0" src="Images/12.jpg" class="bvz_beeldthumb">
</td>
</tr>
....
</tbody>
</table>
我想要的是通过每个td删除图像并将其插入表格之前。而不是删除整个表。 这样做的最佳方式是什么?
感谢。
答案 0 :(得分:1)
您可以使用jQuery并使用each()
遍历所有td
元素,并将td
内的所有图片移到表格之前。
$('td').each(function(){
$('img').insertBefore('table');
$('table').hide();
});
答案 1 :(得分:0)
我有这个工作:
<强> WORKING FIDDLE 强>
$(document).ready(function(){
$('.bvz_beeldthumb').each(function(){
$('.someClass').append(this);
});
$('#mainTable').remove();
});
文档就绪意味着当文档准备好时,代码将被触发。 它在页面上找到所有带有类bvz_beeldthumb的图像,并将其移动到div someClass。之后它删除了表格。
答案 2 :(得分:0)
试一下
$("#mainTable td").each(function() {
var Img=$(this).find("img");
$("#someID").prepend(Img);//here element 'id' in which you want to put these images.
$(this).find("img").html('');
});
我希望这可以帮助你!!
答案 3 :(得分:-1)
您可以尝试类似
的内容
$('#mainTable img').insertBefore('#mainTable')
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table cellspacing="0" cellpadding="0" style="width:100%;border-collapse:collapse;" id="mainTable">
<tbody>
<tr>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=1" class="bvz_beeldthumb" />
</td>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=2" class="bvz_beeldthumb" />
</td>
</tr>
<tr>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=3" class="bvz_beeldthumb" />
</td>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=4" class="bvz_beeldthumb" />
</td>
</tr>
<tr>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=5" class="bvz_beeldthumb" />
</td>
<td align="center">
<img width="127" height="191" border="0" src="//placehold.it/127x191&text=6" class="bvz_beeldthumb" />
</td>
</tr>
</tbody>
</table>
&#13;