Set up time to change class-CodePudding

<div >
</div>

<div >
</div>

How do I set up to change the class on a FIRST DIV at a specific time, with jQuery or javascript .

I want the FIRST DIV to be visible until a certain date and time, then for it to become a DISPLAY:NONE and for the SECOND DIV to become visible at that time, and to restart the page once.

CodePudding user response：

I think you can use a setInterval() to check the time every second , and if the time is between your specified times , show and hide the divs

import moment from 'moment'

function refreshTime() {
    const now = new Date().getHours()
    if (now >= 9 && now <= 18) { //show the first div from 9 am to 6 pm
        document.getElementById('first-div').style.display ='block';
        document.getElementById('second-div').style.display ='none';  // to display
} else {
       document.getElementById('second- div').style.display ='block';
        document.getElementById('first-div').style.display ='none';  // to display
 }
}
 setInterval(refreshTime, 1000);

replace the 1000 inside the setInterval to anyother number if you dont want to recheck the time every one second ,

CodePudding user response：

I fail to refresh the page with this only once.I fail to refresh the page with this only once.