首页jquery table 动态加表头

jquery table 动态加表头

时间: 2023-08-04 14:06:50 浏览: 168

您可以使用jQuery来动态添加表头。以下是一个示例代码： ```html <!DOCTYPE html> <html> <head> <title>动态添加表头</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <table id="myTable"> <thead> <tr> <th>列1</th> <th>列2</th> <th>列3</th> </tr> </thead> <tbody> <tr> <td>数据1</td> <td>数据2</td> <td>数据3</td> </tr> </tbody> </table> <script> $(document).ready(function() { // 动态添加表头 var newHeader = $('<th>新列</th>'); $('#myTable thead tr').append(newHeader); // 动态添加数据 var newData = $('<td>新数据</td>'); $('#myTable tbody tr').append(newData); }); </script> </body> </html> ``` 在上面的示例中，我们首先在`<thead>`部分定义了一些初始的表头列。然后，使用jQuery的`append()`方法在表头的行中动态添加了一个新的表头列，并在表格的主体中动态添加了一个新的数据单元格。您可以根据需要调整代码以满足您的具体要求。希望这可以帮助到您！如有任何问题，请随时提问。

阅读全文