首页创建一个三行三列的表格（边框粗细为1px，表格内容随意填写），一个按钮，当点击按钮时表格的背景颜色变成绿色

创建一个三行三列的表格（边框粗细为1px，表格内容随意填写），一个按钮，当点击按钮时表格的背景颜色变成绿色

时间: 2024-03-18 20:38:30 浏览: 164

以下是一个创建三行三列表格的示例代码，以及添加按钮并实现点击后表格背景颜色变为绿色的示例代码： ```html <!DOCTYPE html> <html> <head> <title>表格示例</title> <style> table, th, td { border: 1px solid black; } </style> </head> <body> <table> <tr> <td>第一行第一列</td> <td>第一行第二列</td> <td>第一行第三列</td> </tr> <tr> <td>第二行第一列</td> <td>第二行第二列</td> <td>第二行第三列</td> </tr> <tr> <td>第三行第一列</td> <td>第三行第二列</td> <td>第三行第三列</td> </tr> </table> <button onclick="changeColor()">改变背景颜色</button> <script> function changeColor() { document.getElementsByTagName("table")[0].style.backgroundColor = "green"; } </script> </body> </html> ``` 在这个例子中，我们使用了 `<style>` 标签来定义了表格和单元格的边框样式。同时，我们添加了一个按钮，并在按钮的 `onclick` 事件中调用了 JavaScript 函数 `changeColor()`，该函数会将表格的背景颜色改为绿色。

阅读全文