如何使用 jquery 在 html 中插入 [关闭]答案

【问题标题】：how to insert in html using jquery [closed]如何使用 jquery 在 html 中插入 [关闭]
【发布时间】：2013-03-16 21:52:41
【问题描述】：

我有一个这样的 html 表格

<table>
   <tr>
       <td>
          1
       </td>
       <td>
           2
       </td>
       <td>
           3
       </td>
       <td>
           4
       </td>
   </tr>
</table>

结果是

1 2 3 4

我希望结果是

1 2

3 4

但在运行时使用 jquery

有什么想法吗？

【问题讨论】：

标签： jquery html css

【解决方案1】：

使用 jQuery

HTML

<table id="table1">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
</table>

jQuery

$("#table1 td:first-child").css("float", "left");
$("#table1 td:nth-child(2)").css("display", "block");
$("#table1 td:nth-child(3)").css("float", "left");
$("#table1 td:nth-child(4)").css("float", "left");

使用 CSS

你也可以使用 css 而不使用 jquery 来做到这一点

HTML

<table id="table2">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
</table>

CSS

#table2 td
{
    float: left;
}
#table2 tr > td:first-child + td
{
    display: block;
    float: none;
}

example

【讨论】：

+1 展示了一种 CSS 方式。不过，使用您的 jQuery，我建议选择所有 td 并将它们向左浮动，然后将选择过滤到 :odd 并清除左侧。您将使用更少的代码获得相同的解决方案，并且它对 OP 更有用，因为它可用于 1-4 或 1-999 个单元...

【解决方案2】：

可以通过将最后 2 个单元格放入新行来重组表格：

$('tr').each(function(){
    $(this).after( $('<tr>').append( $(this).find('td:gt(1)')))
});

演示：http://jsfiddle.net/Fyvwd/

【讨论】：

感谢您的回复.. 这在 4 个单元格的情况下很好，但我的单元格的随机数可能大于 4 个
那么需要更多详细信息。我的解决方案与数量无关。 random number of cells 是什么意思？
不管有多少行都有效jsfiddle.net/Fyvwd/1
此表是从数据库中填充的，因此单元格的数量不是静态的，可能是 4 或 5 个，可能更多......所以我希望它按行显示，每行只有 2 个单元格
你为什么不解释这个问题？当您提供过于简化的示例并且没有完全解释问题时，会浪费人们的时间

【解决方案3】：

<table>
   <tr>
     <td>1</td>
     <td>2</td>
     <td>3</td>
     <td>4</td>
   </tr>
</table>

它有效，但不太正确))

$(document).ready(function(){
    $("td:even").css({"display":"block","float":"left", "clear":"left"});
    $("td:odd").css({"display":"block", "float":"left"});
});

【讨论】：

几乎，我已经编辑了答案，它工作正常
循环是怎么回事？您所做的只是处理td.length 的次数超过您需要的次数。
是的，你说得对，固定
我试过了，还是不行。
我有一个想法，但我需要知道如何实现它我想在 td 的结束标记处添加任何想法如何做到这一点？