<script>
var tb=document.getElementById("tb1");
var tbtr=tb.getElementsByTagName("tr");
var tbtd=tb.getElementsByTagName("td");
var tbrows=tbtr.length;
var tbcols=tbtr[0].getElementsByTagName("td").length;
var tbtds=tb.getElementsByTagName("td").length;
for(var i=0;i<tbrows;i++){
for(var j=0;j<tbcols;j++){
tbtd[(i*tbcols)+j].row=i;
tbtd[(i*tbcols)+j].col=j;
tbtd[(i*tbcols)+j].onmouseover=function(){
for(var k=0;k<tbtds;k++){
if(tbtd[k].row==this.row||tbtd[k].col==this.col){tbtd[k].style.background="#01a951";tbtd[k].style.color="#fff";}
}
}
tbtd[(i*tbcols)+j].onmouseout=function(){
for(var k=0;k<tbtds;k++){
if(tbtd[k].row==this.row||tbtd[k].col==this.col){tbtd[k].style.background="";tbtd[k].style.color="";}
}
}
}
}
</script>
| 1 |
2 |
3 |
4 |
5 |
| 1 |
2 |
3 |
4 |
5 |
| 1 |
2 |
3 |
4 |
5 |
| 1 |
2 |
3 |
4 |
5 |
| 1 |
2 |
3 |
4 |
5 |
| 1 |
2 |
3 |
4 |
5 |
你这个ID为“tb1”的元素是第一个表格吗？能提供更多信息吗？
Css版
csstr:nth-child(2n)>td:nth-child(2n) {
color: #333;
background-color: green;
}
tr:nth-child(2n)>td:nth-child(2n+1) {
color: #666;
background-color: blue;
}
tr:nth-child(2n+1)>td:nth-child(2n) {
color: #666;
background-color: blue;
}
tr:nth-child(2n+1)>td:nth-child(2n+1) {
color: #333;
background-color: green;
}
Scss版
scss@mixin style1 {
color: #333;
background-color: green;
}
@mixin style2 {
color: #666;
background-color: blue;
}
tr {
&:nth-child(2n) {
&>td:nth-child(2n) {
@include style1;
}
&>td:nth-child(2n+1) {
@include style2;
}
}
&:nth-chlid(2n+1) {
&>td:nth-child(2n) {
@include style2;
}
&>td:nth-child(2n+1) {
@include style1;
}
}
}