用js实现1.创建一个三行三列的表格(边框粗细为1px,表格内容随意填写),一个按钮,当点击按钮时表格的背景颜色变成绿色。
时间: 2024-03-20 18:39:39 浏览: 47
点击按钮设置表格背景色
4星 · 用户满意度95%
好的,下面是用纯JavaScript实现的代码:
HTML代码:
```
<table id="myTable" border="1">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
<button id="myButton">点击变绿</button>
```
JavaScript代码:
```
var myButton = document.getElementById("myButton");
var myTable = document.getElementById("myTable");
myButton.addEventListener("click", function() {
myTable.style.backgroundColor = "green";
});
```
解释一下:我们首先通过getElementById()方法获取到按钮和表格元素,然后使用addEventListener()方法为按钮添加了一个"click"事件监听器,当按钮被点击时,会触发回调函数,这个函数会将表格的背景颜色设置为绿色。
阅读全文