javascript - 第二个 td 在第一个 td + html 表之上

Question

我有一个这样的表:

<table>
    <tbody>
        <tr></tr>
        <tr></tr>
        <tr class="TableContent">
            <td class="shouldbeunderTableMenu"></td>
            <td class="TableMenu"></td>
        </tr>
    </tbody>
</table>

如您所见，我有一个类等于 TableMenu 的 td。我想将 td 放在类 shouldbeunderTableMenu 的 td 上。

这样第一个 td 垂直定位在第二个 td 下面。图片澄清:

但是我该怎么做呢？

Answer 1

尝试使用before ,

$(".shouldbeunderTableMenu").before($(".TableMenu"));

$(".shouldbeunderTableMenu").before($(".TableMenu"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tbody>
        <tr></tr>
        <tr></tr>
        <tr class="TableContent">
            <td class="shouldbeunderTableMenu">1</td>
            <td class="TableMenu">2</td>
        </tr>
    </tbody>
</table>

或使用 after

$(".TableMenu").after($(".shouldbeunderTableMenu"));

$(".TableMenu").after($(".shouldbeunderTableMenu"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tbody>
        <tr></tr>
        <tr></tr>
        <tr class="TableContent">
            <td class="shouldbeunderTableMenu">1</td>
            <td class="TableMenu">2</td>
        </tr>
    </tbody>
</table>