<!DOCTYPE html>
<html  xmlns="http://www.w3.org/1999/xhtml">

<!--
    Our first JavaScript example

    Example using (hopefully) unobstrusive-ish JavaScript;
    Inspired by course text

    adapted by: Sharon Tuttle
    last modified: 2016-04-10
-->

<head>  
    <title> our first JavaScript example </title>
    <meta charset="utf-8" />

    <link href="http://users.humboldt.edu/smtuttle/styles/normalize.css" 
          type="text/css" rel="stylesheet" />

    <!-- 
        this external JavaScript contains the function
         sayMagicWord 
    -->

    <script src="please.js" type="text/javascript" 
            defer="defer">
    </script>

    <script type="text/javascript">
        /*-----
            I want to muck with the DOM, but NOT
                until the page is loaded
            (note: setting window's onload attribute to an
                anonymous function!)
        -----*/

        window.onload =
            function()
            {
                var myButton = 
                    document.getElementById("magicButton");

                // onclick attribute is being set to a FUNCTION,
                //    not to the result of calling a
                //    function...

                myButton.onclick = sayMagicWord;
            };
    </script>
</head> 

<body> 
    <h1> Our first JavaScript </h1>
    <h2> (warning - does not operate if JavaScript disabled!)
         </h2>

    <p>  
        <button id="magicButton">
            Say the Magic Word
        </button>
    </p>

    <p> 
        Name: <input type="text" name="text1" id="enteredName" />
    </p>

    <p id="latest">
        There is no latest anything yet.
    </p>

<?php
    require_once("328footer-better.html");
?>

</body>
</html>