<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table border="1px" width="800px" height="400px" cellspacing="0">
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<script src="">
let hang = document.getElementsByTagName("tr");
for (let i = 0; i < hang.length; i++) {
if (i % 2 == 0) {
hang[i].style.backgroundColor = "pink";
}
}
for (let j = 0; j < hang.length; j++) {
hang[j].onclick = function () {
for (let z = 0; z < hang.length; z++) {
hang[z].style.backgroundColor = "white";
}
hang[j].style.backgroundColor = "pink";
}
}
</script>
<script src="./js/tool.js"></script>
<script>
let hang1 = document.getElementsByTagName("tr")
for (let i = 0; i < hang1.length; i++) {
let lie = hang1[i].children;
for (let j = 0; j < lie.length; j++) {
if (j % 2 == 0) {
lie[j].style.backgroundColor = "blue";
}
}
}
let all = document.getElementsByTagName("td");
for (let z = 0; z < all.length; z++) {
all[z].onclick = function () {
let num = all[z].index();
for (let z = 0; z < all.length; z++) {
all[z].style.backgroundColor = "white";
}
for (let x = 0; x < hang1.length; x++) {
hang1[x].children[num].style.backgroundColor = "blue";
}
}
}
</script>
</body>
</html>
