Lesson Twenty: The Object Code

Here is the entire code for the JavaScript file using an object. Note: the document.getElementById code has been moved to the top of the historyevents method and has been deleted from the rest of the property. Since all the statements are written to the same two elements the code does not need to be repeated.

var eventchoice = 0;
var hevents1 = {

event1: "488 Million Years Ago the Mollusks Appeared",
event2: "250 Million Years Ago the Dinosaurs Appeared",
event3: "65 Million Years Ago - Age of the Mammals",
event4: "60 Million Years Ago - The Primates",
event5: "5.2 Million Years Ago - The Hominids",
image1: "images/mollusk1.jpg",
image2: "images/dino.jpg",
image3: "images/mammoth1.jpg",
image4: "images/primates1.jpg",
image5: "images/hominids1.jpg",
historyevents: function() {
eventchoice = eventchoice + 1;
h1 = document.getElementById("h1");
img = document.getElementById("i1");
if (eventchoice == 1) {
h1.innerHTML = hevents1.event1;
img.src = hevents1.image1;}
else if (eventchoice == 2) {
h1.innerHTML = hevents1.event2;
img.src = hevents1.image2;}
else if (eventchoice == 3) {
h1.innerHTML = hevents1.event3;
img.src = hevents1.image3;}
else if (eventchoice == 4) {
h1.innerHTML = hevents1.event4;
img.src = hevents1.image4;}
else {
h1.innerHTML = hevents1.event5;
img.src = hevents1.image5;
eventchoice = 0;}
}
};
function changedesign1() {
link = document.getElementById("link1");
link.href = "histevents2.css";
}
function changedesign2() {
link = document.getElementById("link1");
link.href = "histevents3.css";
}

Lesson Twenty One: Designing the Reading Comprehension Program

Coding

Lesson Twenty: The Object Code