如图,点击时cut方法中为0,就在“文字实录”下添加一条带颜色的线,点击cut为1时“文字实录”下的线消失,”主持人发言“下添加一条带颜色的线。
最好是能在td下面的线,这种要怎么操作,求大佬帮忙
如图,点击时cut方法中为0,就在“文字实录”下添加一条带颜色的线,点击cut为1时“文字实录”下的线消失,”主持人发言“下添加一条带颜色的线。
最好是能在td下面的线,这种要怎么操作,求大佬帮忙
看看我这个例子
<!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>
<style>
.a {
border-bottom: 2px solid red;
}
.b {
/* border-bottom: 2px solid red; */
}
</style>
</head>
<body>
<table>
<tr id="trArr">
<td onclick="cut(0)">文字实录</td>
<td onclick="cut(1)">主持人发言</td>
<td onclick="cut(2)">嘉宾发言</td>
<td onclick="cut(3)">网友提问</td>
</tr>
</table>
</body>
<script>
var tr = document.getElementById("trArr");
var trArr = tr.children;
cut(0)
function cut(val) {
for (let i = 0; i < trArr.length; i++) {
if (val == i) {
trArr[i].className = "a";
} else {
trArr[i].className = "b"
}
}
}
</script>
</html>