java - 每天不同的iframe

Question

我有一个带有两个 iframe 的 HTML。我如何强制 javascript 在实际日期加载具有确切 URL 的特定 iframe？

#div1
{
    width    : 500px;
    height   : 100px;
}

#iframe1
{
    top      : -500px;
    left     : -36px;
}
#div2
{
    width    : 315px;
    height   : 107px;
}
 
#iframe2
{
    top      : -500px;
    pointer-events: none;
}

<div id="div1">
<iframe src="accurateDayURL" id="iframe1" scrolling="no"></iframe>
</div>
<div id="div2">
<iframe src="accurateDayURL-1" id="iframe2" scrolling="no"></iframe>
</div>

Java 索引我在实际日期位置，我需要用每天唯一的 iframe 替换 Array。

var d = new Date()
var weekday=new Array

("url1","url2","url3","url4","url5","url6","url7","url8","url9","url10","url11","url12","url13","url14","url15","url16","url17","url18","url19","url20","url21","url22","url23","url24","url25","url26","url27","url28","url29","url30","url31")
document.write(weekday[d.getDate()])
document.write("<br>");
document.write(weekday[d.getDate()-1])

Answer 1

我们可以使用日期函数使用今天的日期。我们可以计算日期并在 URL 的数组值中尝试这一天。我更新了 Snippet 中的代码。我认为这会更好地帮助您。

var url = ["url1","url2","url3","url4","url5","url6","url7","url8","url9","url10","url11","url12","url13","url14","url15","url16","url17","url18","url19","url20","url21","url22","url23","url24","url25","url26","url27","url28","url29","url30","url31"];

var d = new Date();
			
			var loc= (d.getDate() < 10 ? " 0" : " ") + d.getDate() + " ";
 
    
    var ids = parseInt(loc);
    var srcURL = url[ids - 1];
    
      $('#iframe'+ids).attr("src", srcURL);
    $('#div'+ids).show();

#div1
{
    width    : 500px;
    height   : 100px;
}

#iframe1
{
    top      : -500px;
    left     : -36px;
}
#div2
{
    width    : 315px;
    height   : 107px;
}
 .divs{
 display:none;
 }
#iframe2
{
    top      : -500px;
    pointer-events: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 
<div id="div1" class="divs">
<iframe src="accurateDayURL" id="iframe1" scrolling="no">frame1</iframe>
</div>
<div id="div2" class="divs">
<iframe src="accurateDayURL-1" id="iframe2" scrolling="no">frame2</iframe>
</div>
<div id="div3" class="divs">
<iframe src="accurateDayURL-1" id="iframe3" scrolling="no">frame3</iframe>
</div>
<div id="div4" class="divs">
<iframe src="accurateDayURL-1" id="iframe4" scrolling="no">frame4</iframe>
</div>
<div id="div5" class="divs">
<iframe src="accurateDayURL-1" id="iframe5" scrolling="no">frame5</iframe>
</div>
<div id="div6" class="divs">
<iframe src="accurateDayURL-1" id="iframe5" scrolling="no">frame6</iframe>
</div>

<div id="div24" class="divs">frame24
<iframe src="accurateDayURL-1" id="iframe24" scrolling="no">frame24</iframe>
</div>

<div id="div25" class="divs">frame25
<iframe src="accurateDayURL-1" id="iframe25" scrolling="no">frame25</iframe>
</div>

<div id="div26" class="divs">frame26
<iframe src="accurateDayURL-1" id="iframe26" scrolling="no">frame26</iframe>
</div>

<div id="div27" class="divs">frame27
<iframe src="accurateDayURL-1" id="iframe27" scrolling="no">frame27</iframe>
</div>

<div id="div28" class="divs">frame28
<iframe src="accurateDayURL-1" id="iframe28" scrolling="no">frame28</iframe>
</div>

<div id="div29" class="divs">frame29
<iframe src="accurateDayURL-1" id="iframe29" scrolling="no">frame29</iframe>
</div>

<div id="div30" class="divs">frame30
<iframe src="accurateDayURL-1" id="iframe30" scrolling="no">frame30</iframe>
</div>

<div id="div31" class="divs">frame31
<iframe src="accurateDayURL-1" id="iframe31" scrolling="no">frame31</iframe>
</div>