Chapter 15 - Activity of the Day
The finished project from Chapter 15 of JavaScript for Kids For Dummies by Chris Minnick and Eva Holland
by rosakaufman
HTML
<h1>JS Activity of the Day</h1>
Today Is:
<div id="todaysdate"></div>
<div id="buttonBox">
<button id="whattodo" type="button">What should I do today?</button>
</div>
<div id="thingToDo"></div>
CSS
body {
font-family: "Comic Sans MS";
}
#buttonBox {
margin-top: 30px;
}
#thingToDo {
margin-top: 20px;
background-color: #dadada;
}
JavaScript
var todayDate = document.getElementById("todaysdate");
var todoButton = document.getElementById("whattodo");
// add a listener to the whattodo button
todoButton.addEventListener("click", displayActivity);
// create a new Date object
var d = new Date();
// call the displayDate() function
displayDate();
function displayDate() {
todayDate.innerHTML = d.toDateString();
}
function displayActivity() {
// find out the day of the week.
var dayOfWeek = d.getDay();
/* set a variable, called youShould, with a different
string based on what day of the week it is. */
var youShould;
switch (dayOfWeek) {
case 0:
youShould = "Take it easy. You've earned it.";
break;
case 1:
youShould = "Gotta do what ya gotta do!";
break;
case 2:
youShould = "Take time to smell the roses!";
break;
case 3:
youShould = "Don't forget to eat breakfast!";
break;
ase 4:
youShould = "";
break;
case 5:
youShould = "Make a list of things you like to do.";
break;
case 6:
youShould = "Do one thing from your list of things you like to do.";
break;
default:
youShould = "Error Code 456667355e2-Could Not find Day. g35";
break;
}
// output the value of youShould into the thingToDo div
document.getElementById("thingToDo").innerHTML = youShould;
}
/*