Professional Documents
Culture Documents
Introduction
1. What is the internet?
2. History & development of the internet.
3. Who pays for the internet?
4. What makes the internet work?
5. The client/server Model
6. The use of local client
7. Electronic mail on the internet.
8. How does E-mail work?
9. Reading an internet address
10. Types of discussion lists
11. Introduction to network news
12. How does network news work
13. Newsgroup: what's in a name?
14. Remote Login and File Transfer
15. Introduction to FTP, File Transfer Protocol
16. Resources available to you via FTP
17. Introduction to Gopher
18. Introduction to the world wide web
19. Uniform resource locators, or URLs
20. WWW clients, or "Browsers"
21. Chatting
22. A look at search engines.
Introduction to telnet:
Telnet is the protocol used to establish a login session on a remote computer on the
network. While many computers on the Internet require users to have authorization,
others are open to the public and can be logged onto with telnet. Telnet is not a method
to transfer files from one machine to another, but rather is a way to remotely connect to
another system with priveleges to run specific programs on that system. Some uses of
the Telnet protocol include:
connecting to a library catalog to search that library's collection connecting to a location
that allows public priveleges to search its campus information system connecting to a
location that gives you an up-to-the minute weather report
Basic Telnet Commands
open - establishes a connection to the specified host.close - closes an open connection
and leaves you in the telnet software quit - closes any open telnet sessions and exits
the telnet software. When using a telnet program like NCSA Telnet, you invoke these
commands by way of pull-down menus or command keys.
Introduction to FTP, File Transfer Protocol:
Basic commands in FTP:
To do FTP, a user invokes one of two commands: get the command for transferring a
file from another server to your own computer. put the command for moving a file from
your computer to another one. Who can do FTP? Anonymous vs. authorized privileges
On many servers, called anonymous FTP servers, anyone can do FTP. All that is
required to login is a username (anonymous) and a password (your e-mail address). To
get an idea of the many resources available via FTP, you can look at this selected list of
FTP servers.
Other servers require you to be a registered "authorized" user before you're permitted to
do FTP. In such a case, you would need to contact the system operator for the server
you wish to access, and request an authorization and a password. Getting an
authorization and password might mean that you can get and put only to specific
subdirectories on that server.
Resources available to you via FTP
Freeware
When you download freeware, the author continues to carry the copyright to the
software, but permits you to use the program for free. You can share freeware with
others, as long as you don't sell it.
Public Domain
When you download public domain software, you can use it freely. The creator carries
no copyright, and has released it for anyone to use. There are no limits on distribution or
sale--and anyone can modify the program.
Shareware
When you download shareware, the author continues to carry the copyright to the
software, but you're permitted short-term use of the program for evaluation purposes.
At the end of evaluation period, you must either pay the copyright holder for the
program or destroy all copies you've made of it.
Introduction to Gopher:
Gopher is a client/server system that allows you to access many Internet resources
simply by making selections from a sequence of menus. Each time you make a
selection, Gopher carries out your request to the computer that contains the information
and "serves" it up. For example, if you select a menu item that represents a text file,
Gopher will get that file--wherever it happens to be--and display it for you. As you use
Gopher, some menu items lead to other menus. If you choose one of these, Gopher will
retrieve the new menu and display it for you. Thus you can move from menu to menu,
using only a few key strokes or a mouse to navigate. The power of Gopher is that the
resources listed in a menu may be anywhere on the Internet. As Gopher connects to
computers to comply with your menu selection, you don't need to be preoccupied with
the behind-the-scenes work of connecting to and disconnecting from these various
computers. Gopher does this for you without your even needing to be aware of it. This
automatic connecting makes Gopher popular and useful.
Where did Gopher come from?
"Born" in April 1991, gopher began as a project at the Microcomputer, Workstation, and
Networks Center at the University of Minnesota to help people on campus get answers
to computer-related questions. At the time, the computer center staff had accumulated
answers to thousands of questions regarding computers and software. What was
needed was an easy and efficient way to deliver this information to students, faculty and
staff. Thus, the creation of Gopher reaffirms the adage that necessity is the mother of
invention.
Why is it called Gopher?
The name "Gopher" is appropriate for three reasons:
1.Just as a real gopher successfully navigates beneath the prairie, the Internet Gopher
tunnels through the invisible paths of the Internet to help you find the information
you want.
2.The name refers to someone who fetches things or provides service for other people.
3.The Golden Gopher is the mascot of the University of Minnesota.
Introduction to the World Wide Web
The World Wide Web (also referred to as WWW or W3) is the fastest growing area of
the Internet. While gopher was an important step in allowing users to "browse" through
the Internet's vast resources, the World Wide Web has raised excitement about the
Internet to new heights.
What makes the World Wide Web appealing and innovative is its use of hypertext as a
way of linking documents to each other. A highlighted word or phrase in one document
acts as a pointer to another document that amplifies or relates to the first document.
When looking at a WWW document, the reader doesn't have to follow every pointer, or
link (also called a hypertext link), only those that look interesting or useful. In this way,
the user tailors the experience to suit his or her needs or interests. The other very
appealing aspect of the World Wide Web is the use of graphics and sound capabilities.
Documents on the WWW include text, but they may also include still images, video, and
audio for a very exciting presentation. People who create WWW documents often
include a photograph of themselves along with detailed professional information and
personal interests. (This is often called a person's home page.)
What makes the WWW work?
WWW is another example of client/server computing. Each time a link is followed, the
client is requesting a document (or graphic or sound file) from a server (also called a
Web server) that's part of the World Wide Web that "serves" up the document. The
server uses a protocol called HTTP or HyperText Transport Protocol. The standard for
creating hypertext documents for the WWW is HyperText Markup Language or HTML.
HTML essentially codes plain text documents so they can be viewed on the Web.
Next screen will be appear on your computer, fill the details which required to open new
account
Click on Create my Account button
After this your account will be created Click on inbox button to access your mails
Outlook Express
Outlook Express is a POP3- and IMAP-compatible mail client with a built-in newsreader.
It is available with Internet Explorer for Windows or as a stand-alone client for Mac OS
8.1 to 9.x (it is no longer available for Mac OS X). You can configure it to retrieve email
from your account via POP or configure it as an IMAP client to access your mail on an
IMAP mail server.
Microsoft Outlook Express uses the Internet Connection Wizard to help you configure
your email accounts. If you've never used Outlook Express for email, the Internet
Connection Wizard should start the first time you launch Outlook Express. If you've
already configured your account and wish to reconfigure or add another account (or if
the Internet Connection Wizard fails to start), you will need to manually start the Internet
Connection Wizard. To do so, in Outlook Express, from the Tools menu, select
Accounts... , and then click Add. Select Mail... to start the Internet Connection Wizard
and continue following the directions below:
1. You will be prompted for your "Display name". Enter your full name and click
Next.
2. Select I already have an email address that I'd like to use, enter your Indiana
University email address, and click Next.
If you are unsure of your exact IU email address, see At IU, what is my email
address?
3. For the incoming mail server type, select IMAP. For the name of your incoming
mail server, type imap.iu.edu .
5. Type your username. If you wish the system to remember your password (only
recommended for computers that are physically secure), enter your password.
Otherwise, deselect the Remember Password checkbox. Leave the Log in
using Secure Password Authentication checkbox deselected. In Outlook
Express 4 (but not 5 or 6), it will also prompt you for a "Friendly name:" (enter
something you associate with the server and account, such as Work Email or My
Cyrus Account ), and a "Connection type:". Choose the connection type as
follows:
6. Click Next, and then Finish. If you are prompted to download the folder list for
the IMAP account, click No.
7. From the Tools menu, select Accounts... . Highlight the account you just
created.
8. Click the Properties button, and then the General tab. Under "Mail Account",
enter a name such as Work Email or My IMAP Account .
9. Click the Servers tab, and, under the "Outgoing Mail Server" section, make sure
the checkbox for My server requires authentication is selected. Make sure the
checkbox for Log on using Secure Password Authentication is not selected.
10. Click the Advanced tab, and, under both the "Outgoing mail (SMTP)" and
"Incoming mail (IMAP)" sections, make sure the checkboxes for This server
requires a secure connection (SSL) are selected.
11. Click Apply, then OK, and then Close. When you close the Internet Accounts
dialog box, you will be asked if you wish to download folders from the mail server
you just added. Click Yes.
12. You will be prompted for your password. Then you should see a connection
screen confirming your download.
13. The Show/Hide IMAP Folders window will appear. By default, all folders on your
mail server are listed. Select all folders you do not wish to be displayed in
Outlook Express and click Hide. You can click the Visible tab to confirm which
folders will be displayed. Click OK.
14. In the folder list in the left pane, you will see a set of Local Folders and a set of
folders for each account you have set up. To read new mail for an account, click
Inbox under the account name.
Don't save items to the Local Folder structure unless you want them saved only to the
computer you are using at that time. Once you save an item to the Local Folder
structure, the item is not accessible from the server or from other computers. For
instructions on storing your sent items on your mailbox server, If you cannot send email,
you may need to use a different port for your outgoing server. If port 25 does not work,
try port 465, and vice versa. From the Tools menu, select Accounts... . Highlight the
appropriate account and click the Properties button. Click the Advanced tab. Change
the number in the "Outgoing mail (SMTP):" field from 25 to 465 or vice versa. If you still
cannot send email, contact your Internet service provider (ISP).
Write an E-Mail Message, Send It Now
E-mail addresses must be letter-perfect in order for your mail to reach the intended
destination, and Outlook Express is rich with options for addressing messages
accurately. You type a few letters of the person's name in the To or CC (for carbon
copy) lines, and then Outlook Express automatically supplies the full address from your
address book.
1.Click the Create Mail button.
Save your e-mail. Outlook Express also automatically saves messages as you
write them, so if your computer shuts down unexpectedly, your messages will be waiting
for you in the Drafts folder. But for extra safety, it's not a bad idea—particularly for an
important message—to save your e-mail message as you write. To do this, click Save,
on the File menu.
If you want to enclose more than one file, repeat steps 1 through 3.
Attachment box
4. Finish the message if you haven't already, and click the Send
button.
File size matters. Check the size of files before you send them. If they're a
megabyte or larger, think about asking the recipient if they can, or want to, receive the
file. Or, consider compressing large files before you send them. Some Office programs
include compression features; alternatively, use a third-party program to compress the
file.
HTML
1 HTML 1
1.1 Introduction .
1.2 HTML Tags.
1.3 Main Commands
1.4 Linking to other Documents ..
1.5 Forms and CGI Programming .
1.6 Images .
1.7 HTML Sound Tags .
1.8 Tables .
1.9 Examples
Chapter 1
HTML
1.1 Introduction
Hypertext Markup Language (HTML) is a system for marking up documents with tags
that indicate how text in the documents should be presented and how the documents
are linked together. Hypertext links are quite powerful. Within the HTML markup
scheme lies the power to create interactive, cross-platform, multimedia, client-server
applications. Such a system is the World Wide Web (also known as WWW or just
simply, the Web).
The Web is an interlinked collection of living documents containing formatted text,
images, and sound. These documents are organized into webspaces. A webspace is
typically structured around a home page with links to other pages or documents both in
and outside of the webspace. A home page functions as a virtual meeting place in
cyberspace for the exchange of information. We write a home page in HTML. There are
many home pages with information about HTML and the World Wide Web, HTML is a
language under construction. The continuing development of HTML is conducted on the
Web in an open process. New tools and techniques appear frequently and are quickly
spread throughout the community of Web authors. HTML is not a programming
language and an HTML document is not a computer program. A computer program is a
series of procedures and instructions applied, typically, to external data. An HTML
document, however, is the data. The definition of HTML specifies the Grammar and
syntax of markup tags that, when inserted into the data, instruct browsers - computer
programs that read HTML documents.
Lists
<OL> ... </OL> An ordered (numbered) list (items marked with <LI>)
<UL> ... </UL> An unordered (bulleted) list (items marked with <LI>)
<MENU> ... </MENU> A menu list of items
<DIR> ... </DIR> A directory listing
<LI> A list item of use with <OL>, <UL>, <MENU>, <DIR>
<DL> ... </DL> A definition or glossary list
Blocks of Text
<BLOCKQUOTE> ... </BLOCKQUOTE> Extended quotation
<ADDRESS> ... </ADDRESS> Address often used for document
author identification
Character Formatting
<CODE> ... </CODE> Code sample (usually Courier)
<B> ... </B> Boldface text
<I> ... </I> Italic text
<TT> ... </TT> Typewriter text
<EM> ... </EM> Emphasis (usually italic)
<CITE> ... </CITE> A citation
<PRE> ... </PRE> Preformatted text (preserves linebreak)
<BIG> ... </BIG> Test is slighly smaller than normal
<SMALL> ... </SMALL> Test is slighly smaller than normal
<SUB> ... </SUB> Subscript
<SUP> ... </SUP> Superscript
<KBD> ... </KBD> Keyboard entry
Other Elements
<HR> A horizontal rule line
Attributes
SIZE="..." The thickness of the rule, in pixels
WIDTH="..." The width of the rule, in pixels
ALIGN="..." How the rule line will be aligned on the page
NOSHADE="..." Causes the rule line to be drawn as a solid line
<A> ... </A> With the HREF attribute, creates a link to another document or anchor; with
the NAME attribute, creates an anchor that can be linked to.
Attributes
HREF="..." The URL of the document to be called when the link is
activated
NAME="..." The name of the anchor
Forms
1.6 Images
Images can be created in two ways - with the <IMG> tag and with the Image()
constructor. <IMG> are placed on the form and have a whole set of properties that can
be used to format their position, size and appearance. The images are automatically
formed into the array images[], and numbered in the order of their position in the
document. Thus the first image can be referred to as document.images[0]
Images must be in gif or jpg format.
attributes
SRC="..." the URL of the image
An example is given by
<IMG SRC=
"http://www.paris.org/Musees/Louvre/Treasures/gifs/Mona_Lisa.jpg"> We can also use
the following options (attributes):
ALIGN = "left/center/right"
ALT = "description"
WIDTH = "how wide is the picture"
HEIGHT = "how tall is the picture"
BORDER = "border around the picture"
HSPACE = "horizontal distance between picture and text"
VSPACE = "vertical distance between the picture and the text"
The option ALIGN sets the position of the image across the page. The option ALT is
the text to display if the image is not loaded into a browser.
We can tile a page with the
BACKGROUND = "filename"
option in the <BODY> tag. The image is repeated to fill the window. For example
<BODY BACKGROUND="mypicture.gif" ALIGN=right ALT="My picture to watch">
1.8 Tables
Tables are not just for tables of data. They are also a convenient way to present
sets of images, or to lay out images and related text. A table begins and ends with the
<TABLE> </TABLE> tags. Tables rows are defined by <TR> </TR>; header cells by
<TH> </TH>; and data cells by <TD> </TD>. A table must have at least one row and
one cell. An optional table sub-element, <CAPTION> </CAPTION> supplies a caption
for the table. A simple example is given by <TABLE BORDER>
<TD> Row One - Column One </TD> </TABLE>
Typically, a table with a border is cosmetically more appealing.
A more advanced example is given in the following program
<HTML>
<COMMENT> Table.html </COMMENT>
<BODY>
<TABLE>
<CAPTION> Table Items </CAPTION>
<TR><TH></TH>
<TH> Lunch </TH> <TH> Dinner </TH>
<TR> <TH> Kitchen </TH> <TD> 23 <TD> 30 </TD> </TR>
<TR> <TH> Dining Room </TH> <TD> 31 </TD> <TD> 45 </TD> </TR>
</TABLE>
</BODY>
</HTM>
1.9 Examples
Let us assume the file name of this HTML program is mona.html and the file is on
the C drive. To run it at your favorite browser Netscape’s Navigator or Microsoft’s
Internet Explorer type at the address:
C:\mona.html
Then we press enter.
<HTML>
<HEAD>
<TITLE> An Example of an HTML File Structure </TITLE>
</HEAD>
<BODY BGCOLOR='pink'>
Good Morning Egoli !
<BR> <BR>
Let's do mathematics.
<BR> <BR>
<MATH>
∫_a_^b^{f(x)<over>1+x</over>} dx
</MATH>
<COMMENT> verbatim </COMMENT>
<PRE>
#include < iostream.h >
int main()
{
int a = 7;
int b = 2*a;
cout << "b = " << b;
return 0;
}
</PRE>
<IMG SRC= "http://www.paris.org/Musees/Louvre/Treasures/gifs/Mona_Lisa.jpg">
</BODY>
</HTML>
1.9. EXAMPLES 19
Next we give the HTML file of the web site of the International School for Scientific
Computing. It shows how <IMG> and <A> ... </A> is applied.
<HTML>
<HEAD>
<TITLE> ISSC Certificate Courses </TITLE>
</HEAD>
<BODY BACKGROUND="../breadc2.gif" >
<CENTER>
<H1>Certificate Courses in Scientific Computing
and Software Engineering</H1>
<H4>presented by the</H4>
<H1><EM>International School for Scientific Computing</EM></H1>
</CENTER>
<CENTER>
<IMG SRC="../ISSCweb.gif" HSPACE=50 ALIGN=CENTER>
</CENTER>
<HR>
Currently the ISSC offers the following certificate courses:
<P>
<UL>
<LI> <B>Core Courses</B>
<OL>
<LI> <A HREF="oopcpp/c_cpp.html">
Object-Oriented Programming in C++</A>
<LI> <A HREF="ooadp/c_ooadp.html">
Object-Oriented Analysis and Design using UML</A>
<LI> <A HREF="java/c_java.html">
Programming in Java, HTML and JavaScript</A>
<LI> <A HREF="AdvJava/c_AdvJava.html">Advanced Java</A>
<LI> <A HREF="c_assemb.html">Assembly Language and C++</A>
</OL>
<LI> <B>Scientific Courses</B>
<OL>
<LI> <A HREF="neural/c_neural.html">
Neural Networks, Genetic Algorithms and Optimization</A>
<LI> <A HREF="fuzzy/c_fuzzy.html">
Fuzzy Logic with C++ and Hardware Implementations</A>
<LI> Numerical Methods for Science and Engineering
<LI> Computational Graph & Transport Theory
with Applications and C++ Implementations
<LI> Algebraic Computing using
SymbolicC++, Mathematica, Maple and Reduce
<LI> <A HREF="microproc/c_micropr.html">
Programming Microprocessors & Embedded Systems</A>
<LI> <A HREF="c_infoth.html">
Information Theory and Maximum Entropy Inference</A>
<LI> Fibre Optics with Applications in Communications
<LI> <A HREF="digital/c_digital.html">
Digital Electronics, Programmable Logic Devices and VHDL</A>
<LI> Microprocessor Based Mobile Robots
<LI> <A HREF="unix/c_unix.html">
Unix, Shell Programming and Perl</A>
<LI> <A HREF="c_cqcomp.html">
Classical and Quantum Computing</A>
</OL>
<LI> <B>Specialized Courses</B>
<OL>
<LI> <A HREF="CORBA/c_CORBA.html">
Distributed Objects with CORBA and Java</A>
<LI> <A HREF="c_lisp.html">
Artificial Intelligence using Lisp and C++</A>
<LI> <A HREF="VisualCPP/c_VisCPP.html">
Programming for Windows using Visual C++.</A>
<LI> <A HREF="c_abap.html">SQL, Oracle and ABAP/4</A>
</OL>
<LI> <B>Commerce, Economics and Administration</B>
<OL>
<LI> <A HREF="Finance/c_Finance.html">
Computational Methods for Finance and Economics</A>
</OL>
</UL>
<HR>
All lectures are presented in English. Each certificate course includes about 15 hours of
formal lectures and up to 15 hours of practicals after which you will write an exam.
Should you not pass the exam the first time, you will be offered an opportunity to rewrite
the exam (free of charge). After successful completion you will receive a certificate from
the International School for Scientific Computing certifying that you completed the
<LI> Numerical Methods for Science and Engineering
<LI> Computational Graph & Transport Theory
with Applications and C++ Implementations
<LI> Algebraic Computing using SymbolicC++, Mathematica, Maple and Reduce
<LI> <A HREF="microproc/c_micropr.html"> Programming Microprocessors &
Embedded Systems</A>
Thus JavaScript is an authoring language for the typical Web page designer. It is a
scripting language in which the program is embedded as part of the HTML document
retrieved by the browser.
A JavaScript program consists of one or more instructions (also referred to as code
or commands) included with the HTML markup tags that form our Web documents.
When Netscape encounters a JavaScript instruction, it stops to process it. For example,
the instruction might tell Netscape to format and display text and graphics on the page.
Unlike a program witten in Java, JavaScript programs are not in separate files (though
this is an option using Netscape 3.0 and later). Instead, the JavaScript instructions are
mixed together with familiar HTML markup tags such as <H1>, <P>, and <IMG>.
Because JavaScript is embedded in HTML documents, we can use any text editor or
Web page editor to write our JavaScript programs. The only requirement is that the
editor must allow direct input. Netscape needs to be told that we are giving it JavaScript
instructions, and these instructions are enclosed between
<SCRIPT> ... </SCRIPT>
tags. Within the script tag we can have only valid JavaScript instructions. We cannot put
HTML tags for Netscape to render inside the <SCRIPT> tags, and we cannot put
JavaScript instructions outside the <SCRIPT> tags. JavaScript is designed on a simple
object-based paradigm. An object is a construct with properties that are JavaScript
variables or other objects. An object also has functions associated with it that are known
as the object’s methods. In addition to objects that are predefined in the Navigator client
and the server, we can define or own objects. A JavaScript object has properties
associated with it. We access the properties of an object with a simple notation
objectName.propertyName Note that JavaScript is case-sensitive. Comments in
JavaScript are the same as in
document.write("text");
and
document.writeln("text");
which writes text to the browers window. The document objects is itself a property
of the window object. JavaScript assumes that we mean the current window when
we use the syntax given above. Thus the write and writeln methods insert text
into the document. The two methods are identical, except that writeln appends a
new line character to the end of the string.
The command
document.bgColor = "red";
sets the background color to red. As an exmple of these two commands consider
<HTML>
<HEAD>
<TITLE> document.html </TITLE>
</HEAD>
<BODY>
<SCRIPT>
document.write("Hello Egoli");
document.write("\n");
str1 = "willi";
str2 = "hans";
document.write("<P> str1 = " + str1 + " str2 = " + str2);
document.bgColor = "red";
</SCRIPT>
</BODY>
</HTML>
The concatention operator + concatenates two strings values together. The following
program shows that the prompt provides a string even if we enter digits. Then + will do
concatenation. Thus to obtain numbers we use the Number object.
<HTML>
<SCRIPT>
n = prompt("enter n: ","");
m = prompt("enter m: ","");
x = n + m;
document.write("x = " + x,"<BR>"); // concatenates strings n and m
u = Number(n);
v = Number(m);
r = u + v;
document.write("r = " + r,"<BR>"); // addition of numbers
</SCRIPT>
</HTML>
alert(message) confirm(message)
prompt(message,default)
The most important one is alert("message"); We use this method whenever we wish to
display a message. This message is displayed in a dialog box. The user reads the
message and chooses OK to dismiss the dialog box.
The confirm(message) carries an OK and a Cancel button, and returns the value
true or false, depending upon which button was clicked. We apply it when we are
offering our visitor a simple Yes/No choice. We use confirm() in an if() test.
The dialog box prompt(message,default) carries a text box and OK and Cancel
buttons. It returns whatever text was entered. We use it to obtain information on
pages where we do not want to have a form.
<HTML>
<HEAD>
<TITLE> window.html </TITLE>
</HEAD>
<BODY>
<SCRIPT>
alert("System dialog boxes");
if(confirm("Do you want to do this?"))
alert("Let us begin")
else
alert("In any case we do it")
lnum = prompt("Enter your lucky number",""); // "" clears text box
</SCRIPT>
</BODY>
</HTML>
<HTML>
<COMMENT> SSwitch.html </COMMENT>
<SCRIPT>
s = new String("bella");
for(j=0;j<s.length;j++)
{
c = s.charAt(j);
document.write("j = " + j, "<BR>");
switch(c)
{
case 'a': document.write("character is 'a'","<BR>")
break;
case 'b': document.write("character is 'b'","<BR>")
break;
default: document.write("character is not 'a' or 'b'","<BR>")
break;
}
}
</SCRIPT>
</HTML>
The continue statement inside a for loop or while loop skips over any remaining
lines and loops round again.
The following HTML file gives an example how the for loop and the while loop is
used.
<HTML>
<HEAD>
<TITLE> JSLoop.html </TITLE>
</HEAD>
<BODY>
<SCRIPT>
document.write("Hello Egoli");
for(i=1;i<=10;i++)
{
if((i%2) == 0)
{
document.write("<P>Loop: " + i + "</P>");
}
}
alert("We are leaving the first Script block");
</SCRIPT>
<B> Now we use a script again </B>
<SCRIPT>
sum = 0;
count = 0;
while(count < 10)
{
sum += count;
count++;
}
document.write("<BR> sum = " + sum);
</SCRIPT>
<BR><BR>
<B> Again we enter script to set the background colour </B>
<SCRIPT>
document.bgColor = "red";
</SCRIPT>
</BODY>
</HTML>
JavaScript also has a for ... in statement. It uses it to manipulate objects. The
form is
for(varname in objname)
{ forbody }
The following program shows an example of the for ... in statement.
<HTML>
<TITLE> forin.html </TITLE>
<BODY>
<SCRIPT>
languages = ["C++", "Java", "C", "Lisp"];
var language = "C";
var label = 0;
for(var i in languages)
{
if(language == languages[i])
{
document.write("language in list on position: " + i,"<BR>");
label = 1;
}
}
document.write("label = " + label,"<BR>");
if(label == 0)
{ document.write("language not in list"); }
</SCRIPT>
</BODY>
</HTML>
In the following example we show the use of two functions. The HTML commands to
display a table of the square roots of the integers from 1 to 20 are embedded in the
JavaScript code.
<HTML>
<COMMENT> Function.html </COMMENT>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function sqrttable(myWindow)
{
myWindow.document.write("<B> Square Root Table </B><BR>");
myWindow.document.write("<HR>");
myWindow.document.write("<TABLE BORDER=1 CELLSPACING=5>");
myWindow.document.write("<TR><TD>Number</TD><TD>Squareroot</TD></TR>");
for(var i=1;i<=20;i++)
{
myWindow.document.write("<TR><TD>" + i + "</TD><TD>" + Math.sqrt(i) +
"</TD></TR>");
}
myWindow.document.write("</TABLE>");
myWindow.document.write("<HR>");
}
function display()
{
var dynWindow = window.open("","Title","width=200,height=300,scrollbars",
+ "resizable");
sqrttable(dynWindow);
}
</SCRIPT>
</HEAD>
<BODY>
<FORM name="Show it">
<input type=button value="show table" onClick="display()">
</FORM>
</BODY>
</HTML>
1.9 Prompts
The prompt is a special method of the window object. It displays a dialog box with
a single-text box and Cancel and OK buttons
prompt(message,defaultText)
The word prompt tells JavaScript that a dialog box will appear on the screen. The
word message is the text that is displayed in the prompt box. Lastly, the word
defaultText is the text displayed in the text box.
<HTML>
<HEAD>
<COMMENT> prompt.html </COMMENT>
</HEAD>
<BODY bgcolor=yellow text=black>
<SCRIPT LANGUAGE="JavaScript">
var i;
var j;
var k;
i = 1;
j = 1;
document.write("<H4>");
var m = prompt("enter the number of Fibonacci numbers:",0);
document.write(i + "<BR>");
document.write(j + "<BR>");
k = i + j;
document.write(k + "<BR>");
for(var n=3;n<=m-1;n++)
{
i = j;
j = k;
k = i + j;
document.write(k + "<BR>");
}
</SCRIPT>
</BODY>
</HTML>
Events
JavaScript programs are typically event-driven. Events are actions that occur on
the Web page, usually of something the user does. Examples are: a button click is
an event, giving focus to a form element, resizing the page, submitting a form.
An event, then, is the action which triggers an event handler. The event handler
specifies which JavaScript code to execute. Often, event handlers are placed within
the HTML tag which creates the object on which the event acts. For example, a
hyperlink is subject to a mouseover event, meaning that its event handler will be
triggered when a mouse passes over the link. The JavaScript which is called by the
event handler may be any valid JavaScript code: a single statement or a series of
statements, although most often it is a function call.
The set of all events which may occur, and the particular page elements on which
they can occur, is part of the Document Object Model (DOM), and not of JavaScript
itself. Thus, Netscape and Microsoft do not share the exact same set of events, nor
are all page elements subject to the same events between browsers.
The table below displays some of the most commonly used events supported in both
DOM’s.
Event Occurs when ... Event Handler
========== =========================== =============
click User clicks on form or link onclick
change User changes value of text, onchange
textarea, or select element
focus User gives form element onfocus
input focus
blur User removes input focus onblur
from form element
mouseover User moves mouse pointer onmouseover
over a link or anchor
mouseout User moves mouse pointer onmouseout
off of link or anchor
select User selects form element's onselect
input field
submit User submits a form onsubmit
resize User resizes the browser onresize
window
load User loads the page in the onload
Navigator
unload User exits the page onunload
========================================================
The following program shows an example.
<HTML>
<COMMENT> Event1.html </COMMENT>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
window.onresize = message;
function message()
{
alert("The window has been resized!");
}
</SCRIPT>
</HEAD>
<BODY>
Please resize the window.
</BODY>
</HTML>
In the following example we demonstrate the onBlur event and can see how it is
possible to force a user to enter valid information into a form. The user is forced to
enter a number from 0 to 9.
<HTML>
<COMMENT> onblur.html </COMMENT>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function isDigit(c)
{
return ((c >= "0") && (c <= "9"))
}
function checkValue(field)
{
if(!isDigit(field.value))
{
alert("You must enter a digit from 0 to 9.");
field.focus();
}
if((field.value.length < 0) || (parseInt(field.value) >= 10))
{
alert("You did not enter a digit from 0 to 9");
field.focus();
}
}
</SCRIPT>
<FORM>
Please enter a number from 0 to 9:
<INPUT TYPE=TEXT NAME="number" SIZE=3 onBlur="checkValue(this);">
<BR><BR>
Please enter your name:
<INPUT TYPE=TEXT NAME="name" SIZE=25>
</FORM>
</BODY>
</HTML>
The following example demonstrates the onChange event. We built a pulldown menu
that allows users to jump to different websites or URLs.
<HTML>
<COMMENT> onchange.html </COMMENT>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function jumpTo(URL_List)
{
var URL = URL_List.options[URL_List.selectedIndex].value;
window.location.href = URL;
}
</SCRIPT>
<FORM>
<SELECT NAME="site" onChange="jumpTo(this);">
<OPTION VALUE="http://www.fhso.ch/~steeb"> Applied University Solothurn
<OPTION VALUE="http://issc.rau.ac.za"> ISSC
</SELECT>
</FORM>
</BODY>
</HTML>
The example below shows how to add HTML tags to the VBScript:
<html>
<body>
<script type="text/vbscript">
document.write("<h1>Hello World!</h1>")
</script>
</body>
</html>
Example Explained
To insert a VBScript into an HTML page, we use the <script> tag. Inside the <script> tag
we use the type attribute to define the scripting language.
So, the <script type="text/vbscript"> and </script> tells where the VBScript starts and
ends:
<html>
<body>
<script type="text/vbscript">
...
</script>
</body>
</html>
<body onload="myFunction()">
</body>
</html>
Scripts in <body>
If you don't want your script to be placed inside a function, and especially if your script
should write page content, it should be placed in the body section.
<html>
<head>
</head>
<body>
<script type="text/vbscript">
document.write("This message is written by VBScript")
</script>
</body>
</html>
<body>
<button onclick="myFunction()">Click me</button>
<script type="text/vbscript">
document.write("This message is written by VBScript")
</script>
</body>
</html>
Using an External VBScript
If you want to run the same VBScript on several pages, without having to write the same
script on every page, you can write a VBScript in an external file.
Save the external VBScript file with a .vbs file extension.
Note: The external script cannot contain the <script> tag!
To use the external script, point to the .vbs file in the "src" attribute of the <script> tag:
<html>
<head>
<script type="text/vbscript" src="ex.vbs"></script>
</head>
<body>
</body>
</html>
VBScript Variables
As with algebra, VBScript variables are used to hold values or expressions. A variable
can have a short name, like x, or a more descriptive name, like carname.
Dim x
Dim carname
Now you have created two variables. The name of the variables are "x" and "carname".
You can also declare variables by using its name in a script. Like this:
carname="Volvo"
Now you have also created a variable. The name of the variable is "carname". However,
this method is not a good practice, because you can misspell the variable name later in
your script, and that can cause strange results when your script is running.
If you misspell for example the "carname" variable to "carnime", the script will
automatically create a new variable called "carnime". To prevent your script from doing
this, you can use the Option Explicit statement. This statement forces you to declare all
your variables with the dim, public or private statement.
Put the Option Explicit statement on the top of your script. Like this:
Option Explicit
Dim carname
carname=some value
-
-
-
Assigning Values to Variables
You assign a value to a variable like this:
carname="Volvo"
x=10
The variable name is on the left side of the expression and the value you want to assign
to the variable is on the right. Now the variable "carname" has the value of "Volvo", and
the variable "x" has the value of "10".
--------------------------------------------------------------------------------
Lifetime of Variables
How long a variable exists is its lifetime.
When you declare a variable within a procedure, the variable can only be accessed
within that procedure. When the procedure exits, the variable is destroyed. These
variables are called local variables. You can have local variables with the same name in
different procedures, because each is recognized only by the procedure in which it is
declared.
If you declare a variable outside a procedure, all the procedures on your page can
access it. The lifetime of these variables starts when they are declared, and ends when
the page is closed.
--------------------------------------------------------------------------------
Dim names(2)
The number shown in the parentheses is 2. We start at zero so this array contains 3
elements. This is a fixed-size array. You assign data to each of the elements of the
array like this:
names(0)="Tove"
names(1)="Jani"
names(2)="Stale"
Similarly, the data can be retrieved from any element using the index of the particular
array element you want. Like this:
mother=names(0)
Dim table(4,6)
Asign data to a two-dimensional array:
<script type="text/vbscript">
Dim x(2,2)
x(0,0)="Volvo"
x(0,1)="BMW"
x(0,2)="Ford"
x(1,0)="Apple"
x(1,1)="Orange"
x(1,2)="Banana"
x(2,0)="Coke"
x(2,1)="Pepsi"
x(2,2)="Sprite"
for i=0 to 2
document.write("<p>")
for j=0 to 2
document.write(x(i,j) & "<br />")
next
document.write("</p>")
next
</script>
</body>
</html>
VBScript Sub Procedures
A Sub procedure:
•is a series of statements, enclosed by the Sub and End Sub statements
•can perform actions, but does not return a value
•can take arguments
•without arguments, it must include an empty set of parentheses ()
Sub mysub()
some statements
End Sub
or
Sub mysub(argument1,argument2)
some statements
End Sub
A Function procedure:
•is a series of statements, enclosed by the Function and End Function statements
•can perform actions and can return a value
•can take arguments that are passed to it by a calling procedure
•without arguments, must include an empty set of parentheses ()
•returns a value by assigning a value to its name
Function myfunction()
some statements
myfunction=some value
End Function
or
Function myfunction(argument1,argument2)
some statements
myfunction=some value
End Function
<body>
<button onclick="myfunction()">Click me</button>
</body>
carname=findname()
Here you call a Function called "findname", the Function returns a value that will be
stored in the variable "carname".
document.write(myfunction(5,9))
The function "myfunction" will return the sum of argument "a" and argument "b". In this
case 14.
When you call a procedure you can use the Call statement, like this:
Call MyProc(argument)
MyProc argument
Conditional Statements
Conditional statements are used to perform different actions for different decisions.
In VBScript we have four conditional statements:
----------------------------------------------------------------------------------------------------------------
If...Then...Else
Use the If...Then...Else statement if you want to
There is no ..Else.. in this syntax. You just tell the code to perform one action if a
condition is true (in this case If i=10).
If you want to execute more than one statement when a condition is true, you must put
each statement on separate lines, and end the statement with the keyword "End If":
If i=10 Then
alert("Hello")
i = i+1
End If
There is no ..Else.. in the example above either. You just tell the code to perform
multiple actions if the condition is true.
If you want to execute a statement if a condition is true and execute another statement if
the condition is not true, you must add the "Else" keyword:
<body onload="greeting()">
</body>
</html>
In the example above, the first block of code will be executed if the condition is true, and
the other block will be executed otherwise (if i is greater than 10).
--------------------------------------------------------------------------------
If...Then...ElseIf
You can use the If...Then...ElseIf statement if you want to select one of many blocks of
code to execute:
<body onload="greeting()">
</body>
</html>
--------------------------------------------------------------------------------
Select Case
You can also use the "Select Case" statement if you want to select one of many blocks
of code to execute:
</body>
</html>
This is how it works: First we have a single expression (most often a variable), that is
evaluated once. The value of the expression is then compared with the values for each
Case in the structure. If there is a match, the block of code associated with that Case is
executed.
Looping Statements
Looping statements are used to run the same block of code a specified number of
times.
--------------------------------------------------------------------------------
For...Next Loop
Use the For...Next statement to run a block of code a specified number of times.
The For statement specifies the counter variable (i), and its start and end values. The
Next statement increases the counter variable (i) by one.
Example
<html>
<body>
<script type="text/vbscript">
For i = 0 To 5
document.write("The number is " & i & "<br />")
Next
</script>
</body>
</html>
In the example below, the counter variable (i) is INCREASED by two, each time the loop
repeats.
To decrease the counter variable, you must use a negative Step value. You must
specify an end value that is less than the start value.
In the example below, the counter variable (i) is DECREASED by two, each time the
loop repeats.
Exit a For...Next
You can exit a For...Next statement with the Exit For keyword.
For i=1 To 10
If i=5 Then Exit For
some code
Next
--------------------------------------------------------------------------------
Example
<html>
<body>
<script type="text/vbscript">
Dim cars(2)
cars(0)="Volvo"
cars(1)="Saab"
cars(2)="BMW"
</body>
</html>
--------------------------------------------------------------------------------
Do...Loop
If you don't know how many repetitions you want, use a Do...Loop statement.
The Do...Loop statement repeats a block of code while a condition is true, or until a
condition becomes true.
If i equals 9, the code inside the loop above will never be executed.
Do
some code
Loop While i>10
The code inside this loop will be executed at least one time, even if i is less than 10.
Do Until i=10
some code
Loop
If i equals 10, the code inside the loop will never be executed.
Do
some code
Loop Until i=10
The code inside this loop will be executed at least one time, even if i is equal to 10.
Exit a Do...Loop
You can exit a Do...Loop statement with the Exit Do keyword.
Do Until i=10
i=i-1
If i<10 Then Exit Do
Loop
The code inside this loop will be executed as long as i is different from 10, and as long
as i is greater than 10.
--------------------------------------------------------------------------------
Looping through headers
How to loop through the six headings in html.
Do...While loop
How to make a simple Do...While loop.
Date/Time Functions
Function Description
DateSerial Returns the date for a specified year, month, and day
TimeSerial Returns the time for a specific hour, minute, and second
Top
Conversion Functions
Function Description
Top
Format Functions
Function Description
Top
Math Functions
Function Description
Top
Array Functions
Function Description
String Functions
Function Description
Trim Removes spaces on both the left and the right side of a
string
Function Description
InputBox Displays a dialog box, where the user can write some input
and/or click on a button, and returns the contents
VBScript Keywords
Keyword Description