IT130 -- Final Exam
                             November 5, 2007

Part A. True/False Questions.  2 points for reason, 1 pt for answer.
        For full credit a reason is required for each question.
        Do all questions.


 1. The RGB color code for maroon is rgb(128,0,0).
    True: Maroon is dark red.

 2. The operators = and == mean the same thing.
    False: = means assignment, == means comparison.    

 3. The span tag <span style=font-bold:true>really</span> is equivalent 
    to <strong>really</strong>.
    False: The span tag is not written correctly.  It should look like this:
    <span style=font-weight:bold>really</span>

 4. The following link tag allows many pages to share a style page:
    <link rel=stylepage class=text/css href=stylepage.css />
    True: Every page that includes this link in the head section
          is formatted using the styles in stylepage.css.

 5. The HTML source code &gt;br /&lt; is displayed in a browser as <br />.
    False: &gt;br /&lt; is displayed as >br /< in the browser.

 6. This HTML line is a comment, which is ignored by the browser:
    <comment>This is a comment.</comment>
    False: Here is an HTML comment:  <!-- This is a comment. -->
           A JavaScript comment looks like this:  // This is a comment.

 7. These JavaScript variable declarations are legal:
    var s = dog, number-of-customers = 15, tips&gratuities = 134.54;
    False: Variables cannot contain characters other than underline (_).
           Therefore number-of-customers and tips&gratuities are illegal.

 8. The output of this JavaScript line is 339:
    document.writeln(1 + 2 + 3 + 4 + 5);
    False:  The expression is evaluated from left to right.  1 + 2 gives 3 
            (addition) but then 3 + 3 is concatenation because 3 is a
            string.  The output that is printed is  3345.

 9. JavaScript code must always be placed between <script> and </script>
    tags.
    False:  JavaScript is often placed within script tags, but it can also
            be placed in onclick onload attribute or in other event 
            attributes like onchange, onunloadload, onmouseover, onblur etc.

10. The JavaScript lines
    document.frmMain.txtOutput.value = 
        10 + Math.floor(14 * Math.random( ));
    assigns randomly one of the values 10, 11, 12, 13, 14 randomly to the
    textbox txtOutput.
    False:  The 10 tells what number to start at, and the 14 tells how many
            random outputs are possible.  There are 14 outputs:  10, 11, 12,
            13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23.  If you only want 
            five outputs 10, 11, 12, 13, 14, than use 5 instead of 14 in the
            statement.

11. This JavaScript line changes the background color of the page to yellow:
    document.background-color = yellow;
    False: To dynamically change the color, use  document.bgColor = yellow;

12. The JavaScript code in the onload attribute of the body tag executes
    whenever the page is first loaded or refreshed.
    True: Obvious.

13. The most popular protocol for transmitting webpages over the internet
    is html.
    False: http is the most popular protocol.    

14. Use an input tag with class=submit to submit the data on the current
    form back to the server.
    True:  The data is added to the end of the URL, after the ? mark.  The
           data are recorded in control name, value pairs like this:
           http://www.abc.com?txtname=Alice&txtgender=F&txtage=35

15. If, in a form, the method GET is used to submit data from the browser 
    back to the server, the data is added to the end of the URL.
    True: Obvious.  See the reason for question 14.                                                                  

  

Part B. Write HTML/CSS/JavaScript 10 points each.  Do all 3 problems.

1. Sketch the user interface defined by the HTML code at the bottom of
   this page.

   Answer:

        Amount    Amount
       +------+  +------+
       |10    |  |      |
       +------+  +------+

                 +-----------+
                 |Compute Tax|
                 +-----------+

2. Write a document-level style for the user interface at the bottom
   of this page that does the following:
   a. The body should use Papyrus font with text color FireBrick
      and background color Khaki.
   b. The h3 header should have text 130% of normal size.
   c. Each input tag should be 1.5 inches in width and 0.5 inch in height.

   Answer:
   <style class=text/css>
   body { font-family:Papyrus; color:FireBrick; background-color:Khaki; }
   h3   { font-size:130%; }
   input { width:1.5in; height:0.5in; }   
   </style>

3. Write JavaScript code that will execute when the button is clicked.
   It should get the amount from the textbox txtAmount, compute the 
   tax as 8% of the amount and outputs the tax in the textbox txtAmount.

   Answer:

   Here is the function to put in the head:
   function Compute( )
   {
       var amount, tax;
       amount = parseFloat(document.frmMain.txtAmount.value);
       tax = amount * 0.08;
       document.frmMain.txtTax.value = tax;
   }

The original HTML code:

<html>
<body>

<h3>Compute Tax</h3>

<form name=frmMain>
<table>
<tr style=text-align:center> <td>Amount</td> <td>Amount</td> <tr>
<tr> <td><input class=text name=txtAmount value=10 /></td>
         <input class=text name=txtTax value= /></td></tr>
<tr> <td>&nbsp;</td>
     <td><input class=button value=Compute Tax 
                onclick=Compute( ); /></td></tr>
</table>
</form>
</body>
</html>

Part C. Find the mistakes.  20 pts. 


<html>

<head>
<style class=css/text>
body  { font-family:Verdana
        fontweight;bold; 
img   { width:2in; height:2in; ]
<style>
<script class=javascript>
function Show Side
{
    if (document.frmMain.ddmSide = H)
    {
        document.imgCoin.src = head.jpg;
    otherwise
    {
        document.images.imgCoin. = tail.jpg;
    }

<h2>Show Side of Coin</h1>
<form name=frmCoin>
<p><img name=blank.gif src=imgCoin />
<p>
<select name=ddmSide>
<option val=1>Head</option>
<opt val=2>Tail</opt>
</p>
<p><input class=button value=Show Side of Coin
          on click=showCoin( ); /></p>
<form>
<body>
<html>

Here is the corrected form:

<html>

<head>
<style class=css/text>
body  { font-family:Verdana; 
        font-weight;bold; }
img   { width:2in; height:2in; }
</style>
<script class=text/javascript>
function showCoin( )
{
    if (document.frmMain.ddmSide = H)
    {
        document.images.imgCoin.src = head.jpg;
    }
    else
    {
        document.images.imgCoin.src = tail.jpg;
    }
}
</script>
</head>

<body>

<h2>Show Side of Coin</h2>
<form name=frmCoin>
<p><img src=blank.gif name=imgCoin /> </p>

<p>
<select name=ddmSide>
<option value=H>Head</option>
<option value=T>Tail</option>
</select>
</p>

<p><input class=button value=Show Side of Coin
          onclick=showCoin( ); /></p>
</form>
</body>
</html>