IT 238 -- Jan 12, 2026 Notes

IT 238 -- Jan 12, 2026

Review Exercises

What is the folder structure on the studentweb server for Project 0?
Answer: indentation means subfolder

public_html
    it238
        index.html
        styles.css
        proj1a
            index.html
        proj1b
            index.html
        images
            myimage.jpg

What is a stub page?
Answer: a stub page is a placeholder the actual page (in this case your proj1a or proj1b index.html page. The stub page is used to check if the hyperlinks from the Project 0 index page to the stub page and from the stub page back to the Project 0 index page work. These stub pages will be replaced with the actual Project 1a and 1b pages when they are completed.
What is an entity? What are some common HTML entities that you know?
Answer: An HTML entity is a symbol that cannot be directly represented by a keyboard character. It is of the form &entity_name; Here are some common entities:
```
Entity   Symbol
&lt;       <
&gt;       >
&amp;      &
&quot;     "
&apos;     '
&nbsp;   nonbreaking space
&beta;     β  (Greek letter beta)
&rarr;     →  (right arrow)
&larr;     ←  (left arrow)
&ldquo;    “  (left double quotes)
```
You can look up other entities as needed. Here is a reference that contains the complete list of HTML entities:
https://www.freeformatter.com/html-entities.html.

List the JavaScript operators that you remember from IT 130.

Arithmetic Operators:
+  -  *  **  /  %
** is exponentiation.

Comparison Operators:
==  <  <=  >  >=  !=  ===  !== 

Logical Operators:
&&  ||

Arithmetic Operators:
=  +=  -=  *=  /=

Increment/Decrement Operators:
++  --

Array Lookup Operator:
[ ]

How you define a textfield that looks like this?

Answer: <input type="text" id="txt1">
Why is the label control needed? Why not just use HTML text?
```
<label for="fname">First Name:</label><br>
<input id="fname">
```
First Name:

Answer: The label control has two effects: (1) when the label of a textfield is clicked, the focus goes to the corresponding textfield. Having the focus means that that when the user types at the keyboard, the typed text is entered in the textfield with the focus.
(2) When a screen reader is running and a textfield is clicked or arrived at via tabbing, the contents of the textfield and the label of the textfield are read.
What is the difference between these two HTML tags?
```
<button id="btn1">Click Me</button>
<input type="button" id="btn1" value="Click Me">
```
Answer: Basically they mean the same thing. However, with the <button> tag, you can place additional HTML markup between the start and end tags like this:
```
<button id="btn1"><strong>Click Me</strong></button>
```
You can't put HTML markup in the value attribute of the <input> tag.

What is JavaScript?

In September 1995 JavaScript was created in 10 days by Brendan Eich of Netscape Communications.
It is a lightweight scripting language, used to build websites -- about 1.52 billion of them, 95% of all websites.
Originally, the name of JavaScript was Mocha. It was designed as a web scripting companion to Java.
The name Mocha was changed to LiveScript for marketing purposes.
In 1998, AOL acquired Netscape and formed an alliance with Sun Microsystems to develop web software. At that time that the name of LiveScript was changed to JavaScript. This was a marketing ploy, based on the popularity of Java.
JavaScript and Java are very different, but the two languages have many syntax elements in common.
ECMAScript (starting in 1997) is a standard for JavaScript, which is meant to ensure the interoperability of web pages across different browsers. ECMA means European Computer Manufacturers Association.

JavaScript Output

Hello World Example
Here are four ways in JavaScript to output text:
1. Write to the body of the browser
  
  Try this HTML code in a web page:
```
<!DOCTYPE html>
<html>
    <body>
        <script>
        document.writeln("Hello, World.");
        </script>
    </body>
```
2. Write to the Browser Debugging Console
  
  Using the Chrome Browser, click on the three dots icon in the upper right corner;
  Select More tools >> Developer tools.
  In the HTML code for Item 1, replace the line
```
document.writeln("Hello, World.");
```
  with
```
console.log("Hello, World.");
```
  Refresh the browser. Writing to the browser console is useful for debugging.
3. Display a popup window
  
  In the HTML code for Item 1, use
```
alert("Hello, World.");
```
  instead of
```
console.log("Hello, World.");
```
4. Display Output in a Textfield
  
  You already know how to do this from IT 130. We will look at other possibilities this later.

Functions

A function is a set of statements designed to perform a task.
A function must be called or invoked to execute the statements.

Test this function that converts a length from inches to centimeters:

// BasicFunction Example
// Function definition:
function inToCm(inches) {
    cm = inches * 2.54;
    return cm;
}

// Function test:
var inches = prompt("Enter length in inches", "0");
var cm = inToCm(inches);
document.writeln("Length in cm: " + cm);

// If input is 2, the output is 5.08

Projects 1a and 1b

Look at the Project 1a and Project 1b Descriptions.

Practice Problems

Check the output of these statements:
```
document.writeln("abc");
document.writeln("def");
```
Why are the outputs on the same line? I thought that writeln puts a newline character (\n) at the end of its output. Place these statements in this test script before viewing the HTML page:
```
<html>
    <body>
        <script>
        // Copy JavaScript code to test here.
        </script>
    </body>
</html>
```
Answer: Just because the HTML code goes to a new line doesn't mean that the browser will display it on a new line. The \n character counts as whitespace that is eliminated by the browser. You need <br> to force the browser display to go to a new line:
```
document.writeln("abc<br>");
document.writeln("def");
```