Internet Programming 2

Internet Programming
Unit 1: HTML
HTML and the Internet
HTML and Hello World
HTML and the Sandwich
HTML tags
Parts of a Tag
P tag
B tag
A tag
How the Internet Works (a BRIEF discussion)
Unit 2:Multimedia, Color, and HTML

Hello World as a Picture
IMG tag
Media Ethics
EMBED tag
BODY tag
Hexadecimal colors
Putting it all Together
Bonus
Unit 3:JavaScript, Operators, and Iterators

Hello World in JavaScript
Variables
Operators
while
if
Unit 4:Hello World as an alert()

Functions
Event Driven Programming
FORM tag
INPUT tag
Gotcha()
More INPUT
Greeting
Generating Random Numbers
Appendix 1: Yahoo! Online services

Appendix 2: Tables
Appendix 3: Objects, Functions, and Parameters
Appendix 4: Logical Operators
Appendix 5: switch
Appendix 6: Workshop Projects
Internet Programming
HTML and the Internet

People use language to communicate; so do computers! There are lots of different
languages people speak! There are also lots of different languages computers speak! In
this class, we will learn 2 computer languages. The first of these languages is HTML
(Hyper Text Markup Language). The other language we will learn is JavaScript. We
will learn HTML first because it is easier.
HTML and Hello World

In Computer Science, there is a tradition of writing a "Hello World" program when you
are first learning a new language. "Hello World" may not be a very interesting program,
but if you can write a "Hello World" program then you know you can communicate with
the computer in that language. That is the first step to being able to do more interesting
things. In HTML, the "Hello World" program looks like this:
<HTML>
Hello World
</HTML>
To create your own "Hello World"

1. Push the start button on the screen using the mouse.
2. Choose Notepad.
3. Type the text above.
4. Choose Save from the File menu.
5. Type "hello.html" in the filename box.
6. Choose "All Files" in the filetype box.
7. Choose the "LOCATION"
8. Push the "Save" button.
9. Close Notepad.
10. Open Internet Explorer
11. Choose Open form the File menu.
12. Choose the LOCATION
13. Double click on "hello.html"
HTML and the Sandwich

Writing HTML is kind of like making a sandwich. When you make a sandwich you put a
piece of bread on top and a piece of bread on bottom, but it doesn’t really matter what
you put between them. In HTML, you have to put a <HTML> on top, and a </HTML>
on bottom, but id doesn’t really matter what you put between them. You can put text
(like we did when we wrote "Hello World") or you can put other things like pictures,
sounds, or links to other pages.
HTML tags
The text between a ‘<’ and ’>’ has a special name, a tag. Each tag tells the computer to
do something special, like display the text as HTML, display a picture, skip a line, make
the text bold, embed a sound, etc. The <HTML> on top and the </HTML> on bottom are
tags. These tags tell the computer to interpret all the text between them as HTML. The
tag without the ‘/’ is the starting tag because it comes first; the tag with the ‘/’ is the
ending tag. Not all starting tags have an ending tag. If there is no ending tag, wee will
call it a solo tag. If there is both a starting tag and an ending tag, we will call it a pair of
tags. If there is a pair of tags, the property of the tag applies to everything inside the pair
of tags.
Parts of a Tag
Each tag has a name; the name is the first word in the tag. Many tags also have
attributes; an attribute consists of a paired name and value. For example, in the tag
<IMG SRC= "mypic.GIF">, IMG is the tag name, and SRC= "mypic.gif" is the attribute.
SRC is the attribute name and mypic.GIF is the attribute value. The name of the tag is
not cASe SeNsiTive; that means it doesn’t matter if it is lower case or upper case or both.
The name of the attribute is not case sensitive either, but the value of the attribute is case.
In order to make code easier to read, we will write HTML in all capital letters except for
the attribute values. In HTML, there are many different tags and many of the tags have
many attributes. We will learn about many of the more popular tags in class. You can
learn about other tags by looking in a book about HTML, going to a site on the Internet
that teaches HTML (like www.htmlgoodies.com ), looking at the source code for web
pages you like (choose Source from the View menu in your favorite browser), or asking
other people who know HTML.
P tag
The P tag is a solo tag; it doesn’t have any attributes. The P tag skips a line for a new
‘P’aragraph. It looks like this : <P>. To see how the P tag works, we will write "p.html".
The text fro "p.html" is as follows:
<HTML>
This is without skipping a line.
This is without skipping a line.
This is with skipping a line.
<P>
This is with skipping a line.
</HTML>
Make p.html using the same steps you used to make hello.html.
B tag
The B tag is a paired tag; it doesn’t have any attributes. The B tag makes all the test
between its start tag (<B>) and end tag(</B>) ‘B’old. It looks like this: <B> Some bold
text. </B> To see how the B tag works, we will write "b.html". The text for "b.html" is
as follows:
<HTML>
This is plain text.
<B>
This is bold text.
</B>
</HTML>
Make b.html using the same steps you used to make p.html and hello.html.
A tag
The A tag is a paired tag with attributes. The A tag makes a line you can click on to go to
another page. The attribute we will learn about in class is the href attribute. The href
attribute specifies a URL (Uniform Resource Locator-like an address for the Internet you
will go to when the link is clicked on. There are two kinds of URLs. Local or relative
URLs contain just a filename. Universal URLs begin with a prefix like http:// and
contain the whole address. Relative URLs are better when you will be moving both the
linked to page (the page you are going to) and the linking page (the page you are coming
from). Universal URLs are better when you will be moving just the linking page. There
are advantages to both, so we will learn to do both. The A tag looks something like this:
<A HREF= "something.html"> clickable text </A> . To see how the A tag works, we
will write "link.html." The text for "link.html" is as follows:
<HTML>
<A HREF= "http://www.yahoo.com/" >
This is yahoo! This is a Universal URL!
</A>
<P>
<A HREF= "hello.html">
This is hello. This is a local or relative URL!
</A>
</HTML>
Create link.html in the usual manner.
How the Internet Works ( a BRIEF discussion)

How does the Internet Work? It is best to think of the Internet like a giant postal system
where the post office is always open. Uploading is like sending a copy of something to
the post office. When you upload something, the post office takes what you have sent it
and keeps it in a safe place. Downloading is like getting a copy of something from the
post office. When you download something, you tell the post office you want to see a
copy, and the post office sends you a copy, keeping the original in a safe place, so that
the next person can download it. The post office in our example is actually called a
server. A server is a computer somewhere that is always turned on and at a specific
URL or address. When more people are using the Internet, the post office is busier, and it
takes longer to process your requests. When people are sending more information over
the Internet, it will also take longer to process your requests. When people are sending
more information over the Internet, it will also take longer to upload or download.
Hello World as a Picture
In addition to using text on your web page , you can use graphics. For example, you can
create a picture using paint that says "Hello World."
To create your own "Hello World" graphic:

1. Push the start button on the screen using the mouse.
2. Choose Paint.
3. Choose Attributes from the Image menu.
4. Set the Width and Height equal to 100 pixels.
5. Type "hello.html" in the filename box.
6. Create a small graphic that says "hello world"
7. Experiment with the utilities in the toolbox at the left side of the screen.
8. Choose Save from the File menu.
9. Type "hello" in the filename box.
10. Choose "Graphics Interchange Format (*.GIF)" in the filetype box.
11. Choose the LOCATION
12. Push the "Save" button.
13. The computer will warn you; choose "yes."
14. Close Paint.
IMG tag
The IMG tag is a solo tag; it has attributes. The attribute we will learn about in class is
the source attribute. The IMG tag displays an image(IMaGe). The SRC attribute is the
source(SouRCe) of the filename of the picture you want to display. The image tags looks
like this <IMG SRC= "mypic.ext">. To see how the image tag works, we will write
"pic.html." The text for "pic.html" is as follows:
<HTML>
This is my Hello World picture.
<IMG SRC= "hello.GIF">
</HTML>
Create pic.html in the usual manner.
Media Ethics
Some electronic media is OK to take and distribute. Other electronic media may not be
distributed because it is copyrighted and the copyright owners have not given permission
for you to distribute their work. If you find a work that you already know is copyrighted
and not OK to distribute- like a really popular song in its entirety- you should not take, it
distribute it, or post it to your web page. If you are not sure, check the web page for a
copyright symbol. Fortunately, even with this limitation, there are still many ways to get
music and pictures and stuff. One way is to create your own. You can draw pictures in
Paint (it is located in the same place as Notepad), and then same them as .GIF files in the
file type. Another possibility is to use a digital camera, scanner, video camera, musical
instrument, and/or microphone to create your own. There are also several hobbyists who
post their work on the Internet and let you use it free of charge, and it is fine to take their
work and distribute it as long as you adhere to their rules. (Some may require you to link
back to their site; others may require you to credit them for the work.) You can find
work that falls into this category by using a search engine such as Yahoo!, Google, etc.
In addition to copyright rules, you should consider privacy rules when posting to the
Internet. Generally, it is not wise to put your name, address, telephone number, picture or
other personal information on the Internet without discussing it with your parents first.
EMBED tag
The EMBED tag is a solo tag; it has attributes. The attributes we will learn about in class
are the source attribute, loop attribute, and autostart attribute. The EMBED tag
"EMBEDs" media in your page. The SRC attribute is the source (SourCE) of the
filename of the media you want to play. The LOOP attribute can be true or false. If it is
false, the media will play once and then stop. If it is true, when the media reaches the
end, it will start over and continue as long as the page is active in the browser. The
AUTOSTART attribute can also be true or false. If it is true, the media will start playing
automatically. The embed tag looks like this <EMBED SRC= "mymedia.ext"
AUTOSTART= "true" LOOP = "true"> To see how the embed tag works, we will write
"media.html." The text for "media.html" is as follows:
<HTML>
This is my media.
<EMBED SRC="mymedia.ext" AUTOSTART="true" LOOP="true">
</HTML>
Create media.html in the usual manner. Before you open media.html in Internet Explorer
you will need to find some media and save it to your directory. Also, make sure you save
your media with the exact same name and capitalization and extension as the attribute
value in the SRC tag.
BODY tag
The BODY tag is a paired tag; it has attributes. The attributes we will learn about in
class are the bgcolor attribute and the background attribute. You can use either the
bgcolor or the background attribute, but not both! The body tag contains information
about the whole web page or BODY of the page. the bgcolor attribute allow you to
specify a background color (BackGround COLOR) using hexadecimal colors (see
below). The BACKGROUND attribute allows you to specify an image that will be tiled
to create a background. The body tags look like this: <BODY BGCOLOR=
"00FF00"></BODY> or this <BODY BACKGROUND="back.ext"></BODY>. To see
how the body tag works, we will write "color.html" and "tile.html". The text for
color.html is as follows:
<HTML>
<BODY BGCOLOR="00FF00">
This is green!
</BODY>
</HTML>
Create color.html in the usual manner.
The text for "tile.html" is as follows:
<HTML>
<BODY BACKGROUND="tile.ext">
This is my tiled background.
</BODY>
</HTML>
Before you open tile.html in Internet Explorer you will need to find a picture to tile and
save it to your location. Also, make sure you save your picture with the exact same name
and capitalization and extension as the attribute value in the BACKGROUND tag.
Hexadecimal Colors
In your computer monitor, there are a bunch of phosphors (chemicals) that are red, green,
and blue. (They are these colors because these are the colors that the human eye "sees"
best.) When they are hit with an electron gun, they glow and emit light and you see
things on your computer screen. All other colors of light can be made from red, green,
and blue. Black is made by not turning any light on, and white is made from turning
them all on. You can make other colors by turning red, green, and blue on in varying
amounts. The computer knows what color to make the screen based on a six digit
hexadecimal (16 based) value you tell it. The first two digits represent how much red, the
next two digits represent how much green, and the last two represent how much blue. The
digits can be anything from 0-9,A-F(A=10, B=11, C=12, D=13,E=14,F=15). The left
most digit of each color is multiplied by sixteen and added to the right most digit of each
color to yield values from 0-255 for each color. You can find out the hexadecimal value
of your favorite color easily by double clicking on a color in Paint- double click a pot of
color, click the "define custom colors" option in the popup menu that appears, and over
on the right hand side you will see the RGB(red, green, blue) values for the color that is
selected. Divide these numbers by 16 to get the leftmost number and the remainder is the
rightmost number for each color. Don't forget to map the 2 digit numbers to letters of the
alphabet!

Make a web page that has a picture, sound, a link, and a background (either a solid color
or a tiled picture), some bold text, and some skipped lines.
Bonus
Make a picture link (a picture that you can click on to go to another page).
Hello World in JavaScript
JavaScript is a language that allows you to add interactivity to your web pages. In
JavaScript, the Hello World program looks like this:
<HTML>
<SCRIPT LANGUAGE="JAVASCRIPT">
document.write("Hello World");
</SCRIPT>
</HTML>
Create it in the usual manner and name it jhello.html. You will notice that there is a new
tag, the SCRIPT tag with one attribute, the language attribute. You may have guessed
(correctly!) that there are other scripting languages that can be used on the internet.
VBScript or Visual Basic Script is another popular scripting language, but we won't learn
about it in this class. You have probably also noticed that all the information for the
script is inside the SCRIPT tags. You will need to embed all of your scripts inside script
tags with the correct language attributes. For more commentary on this line of code,
please see Appendix 3.
Variables
A variable is a symbol that represents something else. In JavaScripts, before we can use
a variable, we must declare it like this:
var v;
If we want several variables, we can declare them all together like this:
var a, b, c;
We can also initialize them (give them initial value) when we declare them, like this:
var a=1, b=2, c=3;
Make sure to separate the variables with commas and end with a semicolon. Also, make
sure you have declared and initialized them before you try to use them in an operation.
Variables can represent strings, objects, numbers, and other important data types. For
now, all our variables with be numbers. A single = is called the assignments operator
because it assigns the value on the right side to the variable on the left side.
Arithmetic Operators
We can use several operators on variables, just like we can with numbers. We can do
basic arithmetic including addition:
var a=1, b=2, c;
c=a+b;
c=3 now because 1+2=3.
We can do subtraction
var a=1,b=2,c;
c=b-a;
c=1 now because 2-1 is 1.
We can also do multiplication
var a=3,b=2, c;
c=b*a;
c=6 now because 2*3 is 6.
We can also do division. The division operator returns the integer part only, not the
remainder or fraction
var a=3, b=7,c;
c=b/a;
c=2 now because 7/3 is 2.
We can also do modulus. The modulus operator finds the remainder when one number is
divided by another number.
var a=3, b=7, c;
c=b%a;
c=1 now because the remainder when 7 is divided by 3 is 1.
Additionally, there are two shorthand forms of doing arithmetic.

var a=1;
a++;
The ++ operator is called the increment operator. a++ is the equivalent of a=a+1, so a=2.
You can use this same shorthand form for subtraction, (but not the other operators).
var a=5;
a--
The -- operator is called the decrement operator. a-- is the equivalent of a=a-1, so a=4
The other shorthand form of notation that will work with all operators is:
var a=6;
a+=2
This is equivalent to writing a=a+2, so now a=8.
while
In the computer, a while statement says to do something until a condition is met. For
example, your parents may say, "While there is food on your plate, eat." In JavaScript,
we would write this as
while(foodonplate){
eat();
}
Usually, while statements are used when you want to do something a certain number of
times. For example, if you wanted to print out the numbers from 1 to 100, you might say
<HTML>
<SCRIPT LANGUAGE=JAVASCRIPT>
var x=1;
while(x<=100){
document.write("<P>"+x);
x++;
}
</SCRIPT>
</HTML>
Go ahead and create it and save it as count.html.
Code Dissection
The part of the parameter (the thing in parenthesis) that appears in quotes is called a
literal because that is literally what the computer will print. In this case, it is a P tag from
HTML that will cause a line to be skipped in between each number. The x is called a
variable. Variables are not put between quotes; that is how the computer knows that it is
not a literal. If you had put the x between quotes it would have printed "x" 100 times,
each on a different line. The + sign glues all the pieces of the parameter together into one
big parameter. In the while statement, we want to do this while x is less than or equal to
100. If you had forgotten the = sign it would have only printed from 1 to 99. If you had
put a > instead of a <, it wouldn't have printed anything, because 1 is not > than 100, so
the statement would not have been true, and the body of the loop (the part between the
{}) would not have been executed. The body of the loop is only executed when the
statement is true. If you had forgotten to increment x, the statement would have printed
millions and millions of 1's until you told Internet Explorer to quit- this is called an
infinite loop because the computer will follow the instructions an infinite number of
times. Often, when your computer freezes or stops working, the computer is stuck in
either a long loop or an infinite loop.
if
Like the 'while' statement, the 'if' statement checks to see if something is true. If it is true,
then the body of the statement will be executed. If it is not true, it will not be executed.
<HTML>
var x=1;
while (x<=100){
if(x%2==1){
document.write("<P>"+x);
}
x++;
}
</SCRIPT>
</HTML>
Go ahead and create it and save it as odd.html
Dissecting the Code

In this case, we are using a different operator, the = = or double equals. A double equals
checks to see if both sides are equal. If they are, it returns true. If they aren't, it returns
false. Unlike the single equals, it does not set the left side equal to the right side. There
are six operators you can use; they are = =, <= >=,<,>, and !=. The last one tests to see if
they are not equal; it returns the opposite of what equals returns. If you were to substitute
!= for == in odd.html, you would print the even numbers. The % is the modulus
operator. Since any odd number divided by 2 has a remainder of 1, they will be printed.
Any even number divided by 2 has a remainder of 0 and will not be printed. There is a
shorter piece of code that will do the same thing. Can you figure out what it is?
Hello World as an alert()
The alert function does not need an object. It takes a single parameter, the text you want
to appear in the alert box, a gray dialog box that appears.
<HTML>
alert("Hello World");
</SCRIPT>
</HTML>
Create alert.html in the usual manner. The next few sections may not seem like they
relate to each other, but they will all come together.
Functions
In JavaScript, you can create you own functions. This makes it an extensible language
because you can extend it. A function is a list of instructions for how to perform the
desired action. When you call a function, you are telling the computer to actually
perform the action. When you define a function, you are telling the computer how to do
the action, but the computer won't do it. For example, your parents may tell you to do the
dishes (or call the function child.dodishes(sink,dishes,broom,leftovers);), but before they
told you to do the dishes they taught you what they meant (or defined the function as
follows)
function dodishes(sink, dishes, broom, leftovers){
put dishes in sink
use broom to sweep floors
wipe counters
put leftovers in fridge
}
Event Driven Programming

Event driven programming is the name for the kind of programming where somebody
does something-like press a button- and something happens. For example, when you
type and letters appear on the screen, that is event driven programming. You do
something- press a button on the keyboard- and something happens- letters appear on the
screen. We will create buttons on the screen to push and have events for. To do this, we
will need the HTML form tag and the HTML input tag.
FORM tag
The FORM tag is a pair of tags with one attribute, name. The name attribute is used to
identify the form. For example, <FORM NAME="myform"> and </FORM>. Inside the
form tags, you can put all kinds of input collectors. We will rely on just a few.
INPUT tag
The INPUT tag is a solo tag with several attributes. There are several types of input. For
now, we will only use a button. For a button, the TYPE attribute gets button. The
VALUE attribute gets what you want the button to say-"Click Me" for instance. The
OnClick attribute takes a function that you want to call when the button is pressed.
Gotcha
For our first event-driven program, we will create a button in HTML that when pressed
will cause an alert to be displayed. The code for the program is as follows:
<HTML>
function Gotcha(){
alert("Gotcha!");
}
</SCRIPT>
<FROM NAME="buttonform">
<INPUT TYPE=BUTTON VALUE="Click Me" OnClick="Gotcha()">
</FORM>
</HTML>
Create button.html in the usual manner.
More INPUT
In addition to having your users press buttons, you can collect text from a form using an
input tag of type text. For example, <INPUT TYPE=TEXT VALUE="Howdy" SIZE=10
NAME="greeting">. The VALUE attribute is the text that will initially appear in the text
box. The size is the number of characters the box will hold. The NAME attribute makes
it possible for you to give the box another value and access the current value of the box.
Greeting
<HTML>
function converse(){
alert("You typed "+document.greetform.greeting.value);
document.greetform.greeting.value="Bye-Bye";
}
</SCRIPT>
<FORM NAME="greeetform">
<INPUT TYPE=TEXT VALUE="Howdy" SIZE=10 NAME="greeting">
<INPUT TYPE=BUTTON VALUE="Click Me" OnClick="converse()">
</FORM>
</HTML>
Go ahead and create it and save it as greet.html.
In the function converse, we extract the value of the textbox and alert the user that is what
they typed. Then we set the value of the textbox to ByeBye.
Generating Random Numbers
You can generate random numbers on the computer using Math.random() and
Math.floor(). This is very useful in making games.
<HTML>
function ra(){
var a=Math.floor(Math.random()*numberform.limit.value)+1;
alert("Your random number is "+a);
}
</SCRIPT>
<FORM NAME="numberform">
<INPUT TYPE=TEXT VALUE="Type Limit Here" SIZE=10 Name="limit">
<INPUT TYPE=BUTTON VALUE="Click Me" OnClick="converse()">
</FORM>
</HTML>
Go ahead and create it and save it as random.html.
The Math.random function generated a number (in decimal point) between 0 and 1. We
then multiply it by our limit to get a number between 0 and our limit -1. Then we round
down to get an integer and add 1, so we end up with a number between one and our
number.
Putting it All Together

Now you are ready to put all of what you know together to create a guessing game. The
guessing game should have a text box that lets the user enter a limit, a button to start the
game(this should cause a variable for the number of guesses to be set to zero and generate
a random number for the user to guess). You will also need a text box for the user’s
guesses. Finally, you will need a button for the user to press after they have guessed.
When they press this button, you should increment the number of guesses. Then you
should check to see if their guess is equal to the random number you generated. If it is
equal, tell them they win and how many guesses it took. If it is too high, tell them too
high. If it is too low, tell them too low.
Appendix 1: Yahoo! Online Services
There are actually several options for uploading to the Internet, depending on what server
you are using. This appendix will cover only one option, Yahoo!Geocities, using that
option because it is popular, free, and web-based. It also happens to be the original
method that I learned for uploading.
To build a site at Geocities:

1. Go to YahooGeocities. The URL is: http://geocities.yahoo.com/
2. Click on "Sign up for a free web site"
3. If you already have an ID, you can skip to step 7, otherwise go to step 4.
4. Click on "Sign up now"
5. Fill out the form.
6. Keep trying Yahoo! ID's until you find an available choice
7. In the Existing Yahoo! users box, type your Yahoo! ID and password.
8. Read the Terms of Service and click the Accept button.
9. Choose a topic, and click the continue button.
10. Write down on paper your Yahoo! ID as well as the URL
11. Click on "Build your web site now!"
12. Then choose "Easy Upload"
13. Click the "Browse" button and locate the file using the dialog box.
14. Notice that the path of the file appears in the text box to right of the button.
15. Repeat steps 13-14 for each file you wish to upload, up to five at a time.
16. Click the "Upload" button.
17. You can then choose to "Upload More Files" or return to the "File Manager"
You should, as a manner of courtesy and good practice, create a page called "index.html";
this will be the page that is automatically loaded when your URL is typed. You can link
form index.html to your other pages, or access your other pages directly by typing your
URL with a slash and then the file name.
E-mail
You can also set up -email at Yahoo!
To set up e-mail at Yahoo!
1. Go to Yahoo! The URL is http://www.yahoo.com/
2. Click the email image at the top of the page.
3. Login with your ID and password.
4. Complete the form.
5. You will probably want to uncheck all the options on the next page.
6. Click the Continue to Yahoo! Mail button at the bottom of the page.
7. Your Inbox will appear.
Appendix 2: Tables
One way to display information on a web page in an orderly format is to use a table. A
table is organized into rows and each row is organized into cells. Just like an HTML
document is enclosed within HTML tags-<HTML> and </HTML>, a table must be
enclosed within table TABLE tags-<TABLE> and </TABLE>. Within the table, the
rows must be enclosed by Table Row tags-<TR> and </TR>. Finally, the individual
Table Data elements within the rows must be enclosed by <TD> and </TD>. If you want
a Table Data element to span more than one column, you can use the COLSPAN attribute
and set it equal to the number of columns you want it to span. So, if you want to create a
table with 3 rows, the first row spanning the table, and the second 2 rows having 3 Data
elements each, you would write:
<HTML>
<TABLE>
<TR>
<TD COLSPAN=3> The big Table Data element.</TD>
</TR>
<TR>
<TD> td 1,1</TD>
<TD> td 1,2</TD>
<TD> td 1,3</TD>
</TR>
<TR>
<TD> td 2,1</TD>
<TD> td

Internet Programming 2

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Internet Programming 2

Uploaded by

Copyright:

Available Formats

Internet Programming

Unit 2:Multimedia, Color, and HTML

Unit 3:JavaScript, Operators, and Iterators

Unit 4:Hello World as an alert()

Appendix 1: Yahoo! Online services

HTML and the Internet

HTML and Hello World

To create your own "Hello World"

HTML and the Sandwich

How the Internet Works ( a BRIEF discussion)

To create your own "Hello World" graphic:

Putting it all Together

Additionally, there are two shorthand forms of doing arithmetic.

Dissecting the Code

Event Driven Programming

Putting it All Together

To build a site at Geocities:

You might also like