如何使用jQuery在表中添加表行？

jQuery可用于动态添加表行。这可以在web应用程序中使用，如果需要，用户可以根据需要添加很多行。下面本篇文章就来给大家介绍一下使用jQuery在表中添加表行的方法，希望对大家有所帮助。

使用jQuery在表中添加表行的步骤：

●　构造表行所需的标签

markup = "<tr><td> + information + </td></tr>"

●　选择要添加表行的表体

tableBody = $("table tbody")

●　将标签添加到表体中

tableBody.append(markup)

示例：

<!DOCTYPE html> 
<html> 
<head> 
   	<meta charset="UTF-8">
    <style> 
        table { 
            margin: 25px 0; 
            width: 200px; 
        } 
  
        table th, table td { 
            padding: 10px; 
            text-align: center; 
        } 
  
        table, th, td { 
            border: 1px solid; 
        } 
    </style>
</head> 

<body>
	<p>单击按钮，向表中添加一行</p>
	<button class="add-row">添加表行</button>
    <table> 
        <thead> 
            <tr> 
                <th>表行</th> 
            </tr> 
        </thead> 
        <tbody> 
            <tr> 
                <td>这是第0行</td> 
            </tr> 
        </tbody> 
    </table>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
    <script> 
        let lineNo = 1; 
        $(document).ready(function () { 
            $(".add-row").click(function () { 
                markup = "<tr><td>这是第"  + lineNo + "行</td></tr>"; 
                tableBody = $("table tbody"); 
                tableBody.append(markup); 
                lineNo++; 
            }); 
        });  
    </script>
</body> 
  
</html>

效果图：