使用 JavaScript 将 HTML table 的第一行移动到 thead 标签下

Question

我有一个由 BIRT 生成的 html table 如下：

<table id="myTableID">
    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>

    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>

    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>
</table>

我想编写一个 JavaScript 代码来读取此 table 并按以下形式重写它：在 [=15] 中获取 table 的第一行=] 标签，以及 <tbody> 标签中 table 的其余部分：

<table id="myTableID">
    <thead>
        <tr>
            <th></th>
            <th></th>
            <th></th> 
        </tr>
    </thead>

    <tbody>
        <tr>
            <th></th>
            <th></th>
            <th></th>
        </tr>

        <tr>
            <th></th>
            <th></th>
            <th></th>
        </tr>
    </tbody>    
</table>

我对 JavaScript 有基本的了解，但我不知道如何处理这种情况。请帮忙？

Answer 1

使用prependTo()插入thead元素
使用append()将第一个tr插入thead

$('<thead></thead>').prependTo('#myTableID').append($('#myTableID tr:first'));

console.log($('#myTableID')[0].outerHTML);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<table id="myTableID">
    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>

    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>

    <tr>
        <th></th>
        <th></th>
        <th></th>
    </tr>
</table>

使用 JavaScript 将 HTML table 的第一行移动到 thead 标签下

Move first row of a HTML table under a thead tag using JavaScript

html

javascript

jquery

birt