What's preventing this HTML5 from running the underlying JS?

I've been reading through "Head First HTML5 Programming" by O'Reilly. When I get to the example on page 70 and type out the code exactly as it appears, things seem to go wrong. More specifically, the JavaScript code does seems not to execute. My suspicions lie with the window.onload property.

No copyright infringement intended.

<!doctype html>

<html lang="en">

 <head>
   <title>Phrase-O-Matic</title>
   <meta charset="utf-8">

   <style>
     body { font-family: Verdana, Helvetica, sans-serif; }
   </style>

   <script>
     function makePhrases() {
     var words1 = ["24/7", "multi=Tier", "30,000 foot", "B-to-B", "win-win"];
     var words2 = ["empowered", "value-added", "oriented", "focused", "aligned"];
     var words3 = ["process", "solution", "tipping-point", "strategy", "vision"];

     var rand1 = Math.floor(Math.random() * words1.length);
     var rand2 = Math.floor(Math.random() * words2.length);
     var rand3 = Math.floor(Math.random() * words3.length);

     var phrase = words1[rand1] + " " words2[rand2] + " " + words3[rand3];
     var phraseElement = document.getElementById("phrase");
     phraseElement.innerHTML = phrase; }
     window.onload = makePhrases;
   </script>

 </head>

   <body>
     <h1>Phrase-O-Matic says:</h1>
     <p id="phrase"></p>
   </body>

</html>

Answers


It may be a cut and paste error, but you are missing a "+" operator before words2 in the line:

var phrase = words1[rand1] + " " words2[rand2] + " " + words3[rand3]; 

I was able to find that using the JavaScript console in the Firebug add in to Firefox. It's a great resource if you are doing HMTL and JavaScript development.


Need Your Help

minimize the number of interset points extracted by SURF

surf object-detection

I have a question about feartures extracted by surf ,