功能
表格中的第一行数据应为字体颜色白色,而表格中的其余数据应为字体颜色橙色。
问题:
此时,整行数据为橙色,无法将数据的第一行设置为橙色,而其余数据为白色。有什么问题?请帮忙。
var data = "A,4.0,00:04@B,5.0,00:05@C,9.0,00:09";
var playerList = data.split("@");
var innerList;
for (i = 0; i < playerList.length; i++) {
var [name, , score] = playerList[i].split(",");
var [minute, second] = score.split(":");
$("#Player_Name")
.html(function(index, html) {
var prop = index === 0 ? name : score;
return html + prop + "<br>"
})
$("#Player_Minute_Score, #Player_Second_Score").html(function(index, html) {
var prop = index == 0 ? minute : second;
return html + prop + "<p>"
})
}
&#13;
#Rugby_Scoreboard {
position: absolute;
left: 335px;
top: 182px;
width: 825px;
height: 818px;
border-collapse: collapse;
}
#Rugby_Scoreboard div {
z-index: 50;
position: absolute;
top: 10px;
font-size: 40px;
font-family: 'OpenSans-Bold';
width: 1080px;
color: #ff8c04;
}
#Rugby_Scoreboard div font {
display: block;
}
#Rugby_Scoreboard div font:first-child {
color: white;
}
#Player_Name {
left: 120px;
}
#Player_Minute_Score {
left: 580px;
}
#Player_Second_Score {
left: 700px;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="Game_LeaderBoard" style="position:absolute; z-index:6; top:0px; left:0px; width: 1920px; heigth: 1000px; margin:auto;">
<table id="Rugby_Scoreboard">
<tr>
<td>
<div id="Player_Name">
<font face="OpenSans-Bold"></font>
</div>
</td>
<td>
<div id="Player_Minute_Score">
<font face="OpenSans-Bold"></font>
</div>
</td>
<td>
<div id="Player_Second_Score">
<font face="OpenSans-Bold"></font>
</div>
</td>
</tr>
</table>
</div>
&#13;
答案 0 :(得分:0)
你在#Player_Second_Score
中缺少#调用.html jquery函数时缺少id选择器,因此你没有获得索引而且它永远不会== 0所以函数.css没有被调用
但你为什么甚至使用jquery?您可以使用css伪元素:first-child
或:nth-child(odd, even, or child number)
这还有其他一些需要修复的拼写错误,例如[minute, seconod]
中的第二个拼写错误我们所有人都不用担心
答案 1 :(得分:0)
添加);在结束之后}将会破坏你的整个代码。并且第n个孩子的工作方式就像这个tr:nth-child(1)>td{ color: #ffffff; }
你也可以使用第一个孩子这样做是为了使第一个tr中所有td白色的文本颜色
出于某种原因,它不允许我回复评论