我说的是使用js如何给表格动态加边框并设置隔行变色
时间: 2024-05-14 16:13:32 浏览: 15
您可以使用以下javascript代码来为表格动态添加边框并设置隔行变色:
```
<script>
var table = document.getElementById("table-id");
var rows = table.getElementsByTagName("tr");
for (var i = 0; i < rows.length; i++) {
if (i % 2 == 0) {
rows[i].style.backgroundColor = "#f2f2f2";
}
rows[i].style.border = "1px solid #ddd";
}
</script>
```
希望可以帮到您! 请问您还有其他问题吗?
相关问题
js如何给表格加边框并设置隔行变色
可以使用CSS样式来实现表格边框和隔行变色的效果。具体可以使用以下样式代码:
```css
table {
border-collapse: collapse;
border: 1px solid #ddd;
}
tr:nth-child(even) {
background-color: #f2f2f2;
}
```
将以上代码添加到对应的HTML文件或者CSS文件中,即可实现表格边框和隔行变色的效果。
我说的是使用js如何动态给表格每列加边框
您说了使用js如何动态给表格每列加边框。可以使用以下代码实现:
```javascript
var table = document.getElementById("myTable");
for(var i = 0; i < table.rows.length; i++){
var row = table.rows[i];
for(var j = 0; j < row.cells.length; j++){
row.cells[j].style.border = "1px solid black";
}
}
```
此代码可以动态给表格的每一列添加边框。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)