要使用 HTML 创建在线表格并添加基本操作功能，您可以使用以下步骤：
- 在 HTML 文件中使用
标签创建表格，并使用
、 和 标签创建表头和单元格。 - 使用 CSS 样式设置表格的外观。
- 使用 JavaScript 添加基本操作功能，例如添加行或列、删除行或列、排序等。
以下是一个示例 HTML 代码，其中包括一个带有基本操作功能的表格：
<!DOCTYPE html> <html> <head> <title>在线表格</title> <style> table { border-collapse: collapse; width: 100%; } th, td { text-align: left; padding: 8px; border-bottom: 1px solid #ddd; } th { background-color: #4CAF50; color: white; } tr:hover { background-color: #f5f5f5; } .add-btn { background-color: #008CBA; color: white; padding: 10px 20px; border: none; cursor: pointer; } .del-btn { background-color: #f44336; color: white; padding: 10px 20px; border: none; cursor: pointer; } </style> <script> function addRow() { var table = document.getElementById("myTable"); var row = table.insertRow(-1); var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); cell1.innerHTML = "New cell 1"; cell2.innerHTML = "New cell 2"; } function addColumn() { var table = document.getElementById("myTable"); for (var i = 0; i < table.rows.length; i++) { var cell = table.rows[i].insertCell(-1); cell.innerHTML = "New column"; } } function deleteRow() { var table = document.getElementById("myTable"); table.deleteRow(-1); } function deleteColumn() { var table = document.getElementById("myTable"); for (var i = 0; i < table.rows.length; i++) { table.rows[i].deleteCell(-1); } } </script> </head> <body> <h1>在线表格</h1> <button class="add-btn" onclick="addRow()">添加行</button> <button class="add-btn" onclick="addColumn()">添加列</button> <button class="del-btn" onclick="deleteRow()">删除行</button> <button class="del-btn" onclick="deleteColumn()">删除列</button> <table id="myTable"> <thead> <tr> <th>姓名</th> <th>年龄</th> <th>城市</th> </tr> </thead> <tbody> <tr> <td>张三</td> <td>25</td> <td>北京</td> </tr> <tr> <td>李四</td> <td>30</td> <td>上海</td> </tr> <tr> <td>王五</td> <td>35</td> <td>广州</td> </tr> </tbody> </table> </body> </html>在这个示例中，我们使用 CSS 设置表格的样式，然后使用 JavaScript 编写了四个函数：addRow()、addColumn()、deleteRow() 和 deleteColumn()，用于添加行或列、删除行或列。我们还在 HTML 中添加了四个按钮，分别调用这些函数来实现表格的基本操作。
2023-05-12 09:01:02 更新其他工具0.042205s
