When we operate Div ul Li generally use document.getElementById and Document.getelementstagname selector to select elements, and when we operate the application of the table is more convenient JS operation mode;
For example: tbodies,//select Table Body tbody
THead,//Select the table header, a table can contain only one head
TFoot,//Select the tail of the table, a table can contain only one trailer
Rows, each row of the//TR
Cells Each column
<! DOCTYPE html>
<title> Interlaced </title>
<body>
<table border= "1" width= "id=" Tab1 ">
<thead>
<tr>
<td>ID</td>
<td> name </td>
<td> Age </td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td> Zhang San </td>
<td>18</td>
</tr>
<tr>
<td>2</td>
<td> John Doe </td>
<td>28</td>
</tr>
<tr>
<td>3</td>
<td> Wang er </td>
<td>33</td>
</tr>
<tr>
<td>4</td>
<td> Zhao </td>
<td>56</td>
</tr>
</tbody>
</table>
<script type= "Text/javascript" >
var otab = document.getElementById (' tab1 ');
var ocol = ';
for (Var i=0;i<otab.tbodies[0].rows.length;i++) {
Otab.tbodies[0].rows[i].onmouseover=function () {
Ocol= This.style.background;
this.style.background= ' Red ';
};
Otab.tbodies[0].rows[i].onmouseout=function () {
This.style.background=ocol;
};
if (i%2) {
Otab.tbodies[0].rows[i].style.background= ' #CCC ';
}else{
Otab.tbodies[0].rows[i].style.background= ";
}
}
</script>
</body>
Table Interlaced Color
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
