Question

这就是我所拥有的：

<div class="listWeek">
   <a href="#" onclick="showMaa();"  id="MaaKnop">Mo</a>
   <a href="#" onclick="showDin();"  id="DinKnop">Tu</a>
   <a href="#" onclick="showWoe();"  id="WoeKnop">We</a>
   <a href="#" onclick="showDon();"  id="DonKnop">Th</a>
   <a href="#" onclick="showVri();"  id="VriKnop">Vr</a>
   <a href="#" onclick="showZat();"  id="ZatKnop">Sa</a>
   <a href="#" onclick="showZon();"  id="ZonKnop">Su</a>
</div>

我想根据今天的日子改变一天的颜色。

Answer 1

<强> HTML：

<div class="listWeek">
 <a href="#" data-val="1" id="MaaKnop">Mo</a>
 <a href="#" data-val="2" id="DinKnop">Tu</a>
 <a href="#" data-val="3" id="WoeKnop">We</a>
 <a href="#" data-val="4" id="DonKnop">Th</a>
 <a href="#" data-val="5" id="VriKnop">Vr</a>
 <a href="#" data-val="6" id="ZatKnop">Sa</a>
 <a href="#" data-val="0" id="ZonKnop">Su</a>
</div>

<强> JS：

var s = document.getElementsByTagName('a');
var date = new Date();
for (var i = 0; i < s.length; i++) {
    if (s[i].getAttribute("data-val") == date.getDay()) {
        s[i].style.color = "red"
    }
}

我使用了自定义 data-* 属性
date.getDay() 根据我设计的代码，在数字范围0 - 6的基础上返回当天。
获取标签列表，然后进行迭代。一旦找到当天的比赛，就会改变颜色。

JSFiddle

Answer 2

你应该在问之前尝试过一些东西..无论如何，这是一种快速肮脏的方式来做到这一点

var days = ['MaaKnop', 'DinKnop', 'WoeKnop', 'DonKnop', 'VriKnop', 'ZatKnop', 'ZonKnop'];

var current_day = new Date().getDay();

document.getElementById(days[current_day - 1]).style.color = "#f00";

// or you could add a css class
document.getElementById(days[current_day - 1]).className = "active";

.active{
    color: red;
}

如何根据今天的日期更改ID颜色

2 个答案:

JSFiddle