javascript - 某些TD移至新行后出现多个TD

嗨，我正在动态生成一个表，并以以下方式向其动态添加新的TR和TD。

$('#tableId').append('<tr><th colspan="2"></th>');

上面的代码在我的代码中仅被调用过一次。

然后，我通过以下方式向其中添加TD：

var tempurl = 'http://google.com';
$('<td>').appendTo($('#tableId')).html("<a href='"+tempurl+"'>"+tempurl+"</a>");

我面临的问题是，所有TD都在一行中对齐（仅在同一行中），并且页面宽度增加了很多倍。

我尝试将css添加到表中，以便如果表大小超过TD，请转到下一行：

max-width: 90%;
display: block;

和

display: inline;

但这对我没有效果。

最佳答案

请编写正确的静态HTML表代码，然后使用此代码动态生成仍然正确的表。

这是此类表格的示例：

<table>
    <caption>Google results</caption>
    <thead>
        <tr>
            <th scope="col">Title and link</th>
            <th scope="col">Description</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <a href="http://domain.com/1">Stack Overflow</a>
            </td>
            <td>Stack Overflow is a website (...)</td>
        </tr>
        <tr>
            <td>
                <a href="http://domain.com/2">Stack Exchange</a>
            </td>
            <td>Stack Exchange is a website (...)</td>
        </tr>
    </tbody>
</table>

不需要跨所有行的标题单元格：您可能希望将其用作标题
在垂直表中，您应该在th元素的每一列顶部都有一个标题单元格（thead）（出于可访问性原因，我添加了scope="col"属性。如果标题单元格处于打开状态，则为row每行的左侧。如果您在某处scope或colspan，请不要使用rowspan）
在tbody元素中，每实际行一行（tr）
在每一行中，与标题单元格一样多的td元素（除非存在某些colspan或rowspan）


编辑：为什么您有2个不同的id？令人困惑。

关于javascript - 某些TD移至新行后出现多个TD，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19617324/