Multiple Choice Quiz Maker

4. Add the Quizt

Now that we have created three files (one Javascript containing your quiz questions and answers, a second Javascript containing the quiz script itself, and a stylesheet file defining how your quiz should look) all that remains is to add the actual script into your web page.

There are two pieces of HTML that you need to add to your page to add a quiz to the page. The first piece of code goes in the head of the page.

If you have qiven your files different names when you created them then simply change the filenames within the above code when you add it to your page so that it references the three files by the names that you gave them.

With that added to the head of your page the quiz script will be run just as soon as it can work out where in the page that it should display the quiz. To tell the quiz where to display the two questions that it displays on each page we just need to insert two div tags into the body of the page where we want the questions to appear. (Of course if you changed the number of questions to display one each page from 2 to 1 then you must only add the first div as adding the second will get the quiz confused).

While I have these immediately following one another in my example quiz, you can have whatever you want appear between the two quiz questions, they don't have to appear one immediately after the other. The button allowing the person to submit their answers and move on to the next page will always appear below the last question on the page (if your quiz has an odd number of questions then the last question will appear on a page by itself).