Question

我的html代码如下：

<table class="table_inscription">

    <tr>
            <td colspan="2"><label class="social fb"><p class="nonetext">Facebook</p></label> <input class="text social" type="text" name="facebook" value="<?=$facebook;?>" /></td>
            <td colspan="2"><label class="social socialright sk"><p class="nonetext">SoundClick</p></label> <input class="text social" type="text" name="soundclick" value="<?=$soundclick;?>" /></td>                              
        </tr>   

</table>

我想将其更改为：

<table class="table_inscription">

    <tr>
            <td colspan="2"><label class="social fb"><p class="nonetext">Facebook</p></label> <input class="text social" type="text" name="facebook" value="<?=$facebook;?>" /></td>
    </tr>
    <tr>
            <td colspan="2"><label class="social socialright sk"><p class="nonetext">SoundClick</p></label> <input class="text social" type="text" name="soundclick" value="<?=$soundclick;?>" /></td>                              
    </tr>   

</table>

使用CSS JQUERY和其他方法，有人知道请帮帮我，谢谢

Answer 1

您可以使用unwrap和wrap

<强> Demo

$(function(){
   $('td').unwrap('<tr>');
   $('td').wrap('<tr>');
});

Answer 2

我实际上今晚刚做了类似的事情。我最终只是重建了桌子：

var $newTableEntity = $('<table />');

$('.table_inscription td').each( function(index, td_element){
    var $newRow = $('<tr />').append( td_element );
    $newTableEntity.append( $newRow );
});

$('.table_inscription').replaceWith( $newTableEntity );

请注意，这是使用jQuery。

Answer 3

试试这个，

var $table = $('table').clone();
$table.html('');
$('td').each(function () {
    var $tr = $('<tr/>').html($(this).clone());
    $table.append($tr);
});
$('table').remove();
$table.appendTo('body');

Demo

阅读wrap()和unwrap()

或者简单地说，

$('td').unwrap('<tr>');
$('td').wrap('<tr>');

Demo 1

Answer 4

这可能对您有用：

var table = $(".table_inscription");
var tds = table.find("td");
table.empty();
for(var i=0; i<tds.length; i++) {
    table.append($('<tr><td>' + tds.eq(i).html() + '</td></tr>'));
}

JSFIddle：http://jsfiddle.net/VSF38/

Answer 5

做一些像

这样的事情

var val = $('.table_inscription').html();

val = val.replace("<tr>","");
val = val.replace("</tr>","");
val = val.replace("<td","<tr><td");
val = val.replace("</td>","</td></tr>");

$('.table_inscription').html("");
$('.table_inscription').html(val);

检查它是否有效。

Answer 6

使用jQuery。这样，将代码放在底部或头标记之后

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $('td').unwrap('<tr>');
        $('td').wrap('<tr>');
    });
  </script>

使用Jquery，CSS修改表中的html标记

6 个答案: