html怎么给table标签动态添加tr

html怎么给table标签动态添加tr,第1张

htm给table标签动态添加 tr(行),具体参考代码如下: usually function 序号 姓名 年龄 生日 备注 删除 用户输入表单: 姓名 年龄 生日 备注 添加 function del(obj){ //alert($(obj).closest("tr").attr("outerHTML"))//$(obj).closest("tr")...

分两种情况,第一td是现成的,不需要jQuery来加,这样 你直接调用each方法就行,里面有个变量i 每次都加1

第二种情况td未知,这样的话,就直接for循环好了,每次循环都加一遍td和里面的id 循环外面定义一个html 这样到之后html里面就是所有的td 把他直接append到指定的tr下面就可以了

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>JS Table</title>

        <style>

            .blue {

                background:blue

                color:#fff

            }

            

            .red {

                background:red

                color:#fff

            }

        </style>

    </head>

    <body>

        <table id="t">

            <tr>

                <th>Column One</th>

                <th>Column Two</th>

                <th>Column Three</th>

                <th>Column Four</th>

            </tr>

            <tr>

                <td>Data One</td>

                <td>Data Two</td>

                <td>Data Three</td>

                <td>Data Four</td>

            </tr>

            <tr>

                <td>Data Five</td>

                <td>Data Six</td>

                <td>Data Seven</td>

                <td>Data Eight</td>

            </tr>

        </table>

        <script>

            var t = document.getElementById("t")

            //下面是 js 控制表格行列

            t.rows[1].cells[1].className= "blue"

            t.rows[2].cells[3].className = "red"

        </script>    

    </body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11893559.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-19
下一篇 2023-05-19

发表评论

登录后才能评论

评论列表(0条)

保存