試圖根據今天的日期第一個JS項目

顯示隱藏的div如上所述，默認情況下，div使用CSS隱藏。我有這個腳本到目前爲止：試圖根據今天的日期第一個JS項目

<script type="text/javascript"> 
    function makeDate(){ // makes the date and defines "today" variable for data-display-before" and "data-display-after" to work. also logs todays date to console for troubleshooting 
    var now = new Date(); 
    var day = now.getDate(); 
    var month = now.getMonth()+1; 
    today = month+"-"+day; 
    var x = document.querySelectorAll(".date-display-after").getAttribute(); 
    var y = document.querySelectorAll(".date-display-before").getAttribute(); 
    console.log("the date today in MM/DD format is "+today); //for troubleshooting 

    if (today >= x && today <= y){ //the juicy bit 
     document.getElementById(".hidden").style.display = 'block'; 
    } 
} 
    //setInterval("makeDate()", 3000); 
</script>

我懷疑這是行不通的，因爲我不能比較整數與字符串？無論是這個問題還是語法問題。我試圖遵循一個答案，我曾在一個相關的帖子，上面寫着「有問題的兩個屬性添加到的div像數據顯示後數據顯示之前，例如：

<div id="valentines" 
    data-display-after="2016-02-14 00:00:00" 
    data-display-before="2016-02-15 00:00:00">...Hide these divs initially (with CSS).

在頁面負載轉換當前日期（新日）到上述格式。

對於文件，有數據顯示，前屬性的每個元素（你需要querySelectorAll），比較屬性值（的getAttribute）和

if currentDate >= data-display-after && currentDate <= data-display-after, 
then show the element."

我希望得到一些關於如何最好地處理變量的建議ES。繼承人的HTML是什麼樣子：

<body onload="makeDate()"> 
<div class="occasion" id="hidden" date-display-after="02-01" date-display-before="02-15"> 
<div class="textbox"><h5>Valentines day</h5><p><span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime nobis non veritatis quaerat eveniet, necessitatibus, assumenda alias in voluptatum eius voluptate beatae doloribus sed rem officiis ullam perspiciatis earum, aliquam.</span> 
<span>Incidunt officiis eligendi quisquam debitis! Vitae voluptates cum architecto culpa voluptatum nam excepturi laborum. Omnis quasi aut ea explicabo, porro quisquam reiciendis animi, mollitia, et error earum tempora, ad asperiores.</span> 
<span>Commodi necessitatibus et atque odio eos, itaque quaerat, unde animi, provident deserunt quisquam fugit porro fugiat blanditiis quibusdam culpa quo deleniti molestiae numquam dignissimos alias! Inventore libero incidunt, alias possimus!</span></p></div> 
<div class="picture"></div>

的DIV應該是今天可見的，因爲控制檯輸出：

the date today in MM/DD format is 2-5

來源

2016-02-05 Jack Gerrard

有趣的問題。我看到的一個問題是，你可能意味着使用querySelectorAll（「。occasion」）來獲取所有場合，然後每次使用getAttribute獲取after和before日期 - 因爲你的x和y變量是空的。 –

'document.getElementById（「。hidden」）'不正確。它應該是'document.getElementById（「隱藏」）'。 –

感謝Jason的回覆，我編輯了上面的代碼，仍然沒有運氣。 –

如果我理解正確，時間計算不被看到用戶，那麼爲什麼你需要將所有內容轉換爲MM/DD格式？這將是更容易的開始和結束日期轉換爲次，並比較他們現在

//Get current time 
 
var d = new Date(); 
 
//get year 
 
var y = d.getFullYear(); 
 
//Convert to milliseconds 
 
var n = d.getTime(); 
 

 
//Convert dates to date objects 
 
var x = y + '-01-14T00:00:00'; 
 
var s = new Date(x); 
 
var y = y + '-02-15T00:00:00'; 
 
var e = new Date(y); 
 

 
//Convert to milliseconds 
 
var start = s.getTime(); 
 
var end = e.getTime(); 
 

 
//compare 
 
if (n >= start && n <= end) { 
 
    console.log('show hidden div'); 
 
}

來源

2016-02-05 06:44:34 sideroxylon

建議你好，謝謝你回來。我正在轉換爲MM/DD，因爲我想確保代碼在2017年和2018年等是正確的......你認爲這是可能的嗎？ –

getTime（）爲您提供任何日期/時間的絕對數字，等於1970年1月1日以來的毫秒數。僅比較這些數據比轉換爲MM/DD更簡單。 – sideroxylon

這個問題是我有6個div想要展示，他們每個人都在一年中的某個特定時間，我也需要這個代碼在明年和之後工作。 –

試圖根據今天的日期第一個JS項目

回答

相關問題