Javascript

Introduction to Website Design & Development

What is JavaScript?
“JavaScript is a programming language designed for Web pages”
Commonly refereed to as Scripting language which means lightweight
programming language.
What is a programming language?
“It is a vocabulary and set of rules for instructing a computer or computing device
to perform specific tasks”
Examples include:
Python, Java, C#, C++, Perl….

Why Use JavaScript?
• JavaScript enhances Web pages with dynamic and interactive
features.
• JavaScript runs in client side(Browsers) software .
• JavaScript 1.3 works with version 4.0 browsers.

What Can JavaScript Do?
• Common JavaScript tasks can replace server-side scripting.
• JavaScript enables shopping carts, form validation, calculations,
special graphic and text effects, clocks, and more.
• JavaScript can put dynamic text into an HTML page
• JavaScript can be used to detect the visitor’s browser
• JavaScript can be used to create cookies
• Store and retrieve information on the visitor’s computer

JavaScript Syntax
• Unlike HTML, JavaScript is case sensitive.
• Dot Syntax is used to combine terms.
• e.g., document.write("Hello World")
• Certain characters and terms are reserved.
• JavaScript is simple text (ASCII).

JavaScript Terminology
• JavaScript programming uses specialized terminology.
• Understanding JavaScript terms is fundamental to understanding the
script.
• Objects, Properties, Methods, Events, Functions, Values, Variables,
Expressions, Operators.

Objects
• Objects refers to windows, documents, images, tables, forms, buttons
or links, etc.
• Objects should be named.
• Objects have properties that act as modifiers.

Properties
• Properties are object attributes.
• Object properties are defined by using the object's name, a period,
and the property name.
• e.g., background color is expressed by:
• document.bgcolor .
• document is the object.
• bgcolor is the property.

Methods
• Methods are actions applied to particular objects. Methods are what
objects can do.
• e.g. document.write(”Hello World")
• document is the object.
• write is the method.

Events
• Events associate an object with an action.
• e.g., the OnMouseover event handler action can change an image.
• e.g., the onSubmit event handler sends a form.
• User actions trigger events.

Functions
• Functions are named statements that performs tasks.
• e.g., function doWhatever () {statement here}
• The curly braces contain the statements of the function.
• JavaScript has built-in functions, and you can write your own.

Values
• Values are bits of information.
• Values types and some examples include:
• Number: 1, 2, 3, etc.
• String: characters enclosed in quotes.
• Boolean: true or false.
• Object: image, form
• Function: validate, doWhatever

Variables
• Variables contain values and use the equal sign to specify their value.
• Variables are created by declaration using the var command with or
without an initial value state.
• e.g. var month;
• e.g. var month = August;

Expressions
• Expressions are commands that assign values to variables.
• Expressions always use an assignment operator, such as the equals
sign.
• e.g., var month = May; is an expression.
• Expressions end with a semicolon.

Operators
• Operators are used to handle variables.
• Types of operators with examples:
• Arithmetic operators, such as +, - .
• Comparisons operators, such as equals.
• Logical operators, such as and.
• Control operators, such as if.
• Assignment and String operators.

Methods of Using JavaScript
1. JavaScripts can reside in a separate page.
2. JavaScript can be embedded in HTML documents -- in the <head>,
in the <body>, or in both.
3. JavaScript object attributes can be placed in HTML element tags.
e.g., <body onLoad="alert('WELCOME')">

1. Using Separate JavaScript Files
• Linking can be advantageous if many pages use the same script.
• Use the source element to link to the script file.
• <script src="myjavascript.js”
• language="JavaScript1.2”
• type="text/javascript">
• </script>

2. Embedding JavaScript in HTML
• When specifying a script only the tags <script> and </script>
are essential, but complete specification is recommended:
<script language="javascript”
type="text/javascript">

</script>

3. Using JavaScript in HTML Tags.
• Event handlers like onMouseover are a perfect example of an easy to
add tag script.
• <a href=”index.html”
• onMouseover="document.logo.src='js2.gif'"
• onMouseout="document.logo.src='js.gif'">
• <img src="js.gif" name="logo">
• </a>

Creating an Alert Message
• The following script in the <body> tag uses the onLoad event to
display an Alert window
• The message is specified within parenthesis.
• <body onLoad="alert('WELCOME. Enjoy your
visit. Your feedback can improve cyberspace.
Please let me know if you detect any problems.
Thank you.')">

Using Comment Tags
• HTML comment tags should bracket any script.
• The  tags hide scripts in HTML and
prevent scripts from displaying in browsers that do not interpret
JavaScript.
• Double slashes // are the signal characters for a JavaScript single-
line comment.

Javascript

Recommended

More Related Content

What's hot (20)

Similar to Javascript (20)

Recently uploaded (20)

Javascript