I’m trying to make a schedule to change who is doing a task every 7 days. I need it to change a html element class and repeat every Friday. Thanks in Advance.
var date = new Date();
var dayOfWeek = Date.getDay(); // 0 is Sunday, 1 is Monday, etc...
var kestrals = document.getElementById("k");
var eagles = document.getElementById("e");
var merlins = document.getElementById("m");
var currentDuty
var intervalID = window.setInterval(changeDuty, 10000);
function changeDuty() {
if(dayOfWeek=5) {
//Dont know what do do here
}
}
2
Answers
One solution might be to use the
classList
property of the element.Example:
There are many issues with your code and you underestimate the complexity of that task.
I will not tell you everything you have done wrong but start over with that task from scratch.
First of all, you must understand how Javascript works. JavaScript is client-sided and runs within the browser. This means that JS will run if a website or web application is called and continues until the website is closed.
Your task is, that on Friday the name on duty changes. Let’s assume you open the website at Thursday 11:59 pm. Then Kestrel would be on duty. One minute later, the duty changes. So you need your functions to run at a small time frame over and over again to keep up to date. If as @4efirrr suggested running check only every 7 days, then the update of the duty will happen next week at 11:59 pm when actually the next group is only for one more minute on duty. If you check every second, then you put too much load on the browser and the PC which is unnecessary.
However, the main issue with that is, that it assumes that the website/web application is open and running 24/7. The website or application is not allowed to be ever closed!
Why?
let’s assume Eagels is on duty. What will happen if you close the application and re-open it? Then the script will start over from the start and Kestrel would be shown on duty.
The easiest way to solve the issue is by checking the current week’s number of the year. What you can do with that function:
To update the duty on every Friday you can use an if statement that checks if it is Friday or later in the week. It will cause an issue on Sunday as it has the number
0
which is smaller and not higher than5
. SO you need to add anor
within the condition. If that condition is true, you simply add1
to the week’s number to change the duty early:When you have the week number you can use a simple division:
week's number / amount of names
and take the remainder (%
in programming). With that remainder, you can pick the correct name from the list of all names such as:Then you remove the class
duty
from all elements and add it to the element that should be on duty by using theclassList
+add()
/remove()
methods.PS: I highly advise you not to use id names such as
k
,e
, andm
. It is a bad habit and poor coding. In fact, in most companies, it is a requirement (convention) to use ids and names that speak for themself. This allows others to easily read and understand your code and as such makes maintenance easier. which results in shorter maintenance times. Maintenance time is working time and as such costs wages/salary. So you have economic reasons to make ids, classes, variables, and constants names longer in return for readability, maintenance, and lower costs.Another thing I changed which is also important for productive use is scalability. @4efirrr had hardcoded everything. That will cost a complete overhaul if a name changes or names are added/deleted. Good code will not care for the exact names nor how many names exist. In my example, you can simple add or remove names within the array and it will still work correctly.WHich again comes back to the above mentioned economic point. If a program needs to be overhauled to adjust for changes then it cost time and money. Adding or removing or changing a name within an array is a matter of seconds.