我可以使用JS测试日期，然后显示True的HTML代码吗？

Question

我有4行HTML代码

<img class="currentbanner" width="100%" src="src/play1.png">
<img class="currentbanner" width="100%" src="src/play2.png">
<img class="currentbanner" width="100%" src="src/play3.png">
<img class="currentbanner" width="100%" src="src/play4.png">

根据日期，我只需要显示一个特定的png文件。

如果今天的日期介于11/10/2019（MM / DD / YYYY）和03/29/2020 show play1.png。如果今天的日期在2020年3月30日至2020年6月21日之间，请显示play2.png。等

到目前为止，我有

var dateFrom = "11/10/2019";
var dateTo = "03/29/2020";
var check = Date();

var from = Date.parse(dateFrom);
var to   = Date.parse(dateTo);
var check = Date.parse(dateCheck );

if((check <= to && check >= from)) {     
    ?HTML CODE HERE?    
}
else {
    ?LOOP AGAIN 3 TIMES?
}

编辑：我还需要HTML的这些行介于div标签之间，以便它们可以提取一些CSS代码。

Answer 1

只是基本日期比较。我只有一张图像，只是设置了来源。

var currentDate = new Date()
var img = document.querySelector(".bannerImage")
if (currentDate < new Date("12/01/2019")) {
  img.src = "http://placekitten.com/200/300"
} else if (currentDate < new Date("2/01/2020")) {
  img.src = "http://placekitten.com/300/300"
} else if (currentDate < new Date("4/01/2020")) {
  img.src = "http://placekitten.com/400/300"
} else {
  img.src = "http://placekitten.com/500/300"
}

<img class="bannerImage" />

Answer 2

拥有1个图像标签可能更容易：

<img id="bannerImg" class="currentbanner" width="100%" src="src/placeHolder.png">

然后相应地设置图像：

var currentDate = new Date()
var img = document.getElementById("bannerImg")

if (currentDate < new Date("12/01/2019")) {
  img.src = "rc/play1.png"
} else if (currentDate < new Date("2/01/2020")) {
  img.src = "rc/play2.png"
} else if (currentDate < new Date("4/01/2020")) {
  img.src = "rc/play3.png"
} else {
  img.src = "rc/play4.png"
}