HTML and JavaScript

Course Objectives
Whilst covering the basics of XHTML and how it is used, this Course also aims to give an insight into XHTML syntax, web page presentation and JavaScript. Issues such as XHTML syntax, valid and invalid XHTML, CSS style sheets and JavaScript are discussed. On completion of this Course the student will be able to:

• Develop XHTML web pages using valid XHTML syntax
• Develop XHTML web pages using images and links
• Develop XHTML web pages using lists and tables
• Develop XHTML web pages using image maps
• Develop XHTML web pages using CSS style sheets
• Develop XHTML web pages using frames
• Develop XHTML web pages using forms
• Develop XHTML web pages using basic JavaScript statements
• Understand and use JavaScript statements
• Understand and use JavaScript Operators
• Understand and use JavaScript Methods
• Understand and Navigate the JavaScript Document Object Model
• Develop and process XHTML form web pages
• Develop and process XHTML web pages containing frames
• Develop and process XHTML web pages using cookies

Course Details
XHTML SYNTAX
XHTML Syntax
Embedded Elements and Tags
Start and End Tags
Elements
Attributes
XHTML Page Content
Comments
Text and Text Appearance
Content Based Styles
Character References
Text Structures
Hyperlinks
List, Forms and Tables
Well Formed Documents
DOCUMENT STRUCTURE
The HTML, HEAD and TITLE Elements
The HTML Element
The HEAD Element
The TITLE Element
The BASE Element
The META Element
The BODY Element
Colour Settings
HEADINGS, DIVISIONS AND PARAGRAPHS
Headings
The H1, H2, H3, H4, H5, H6 Elements
Grouping Elements
The DIV Element
Paragraphs
The P Element
PRECISE SPACING AND LAYOUT
Space Handling
Controlling and Prohibiting Line Breaks
The BR Element
The NOBR Element
Floating Objects
Floating Objects Around an Object
Preformatted Text
The PRE Element
Alignment
The CENTER Element
The ALIGN Attribute
Rules
The HR Element
The Layer Element
CONTENT BASED STYLES
Content Based Elements
The ADDRESS Element
The BLOCKQUOTE Element
The CITE Element
The CODE Element
The DFN Element
The EM Element
The KBD Element
The SAMP Element
The STRONG Element
The VAR Element
PHYSICAL STYLES
Physical Style Elements
The BLINK Element
FONTS, FONT FACE and FONT COLOR
Font Modifier Elements
The BASEFONT Element
The FONT Element
LINKS
An Introduction to Links and Anchors
Visiting a Linked Resource
Links Within a Document
The A Element
The Syntax of Anchor Names
LISTS
An Introduction to Lists
Unordered Lists
The UL Lists Element
Ordered Lists
The OL ListsElement
List Items
The LI Element
Definition Lists
The DL Element
The DT Element
The DD Element
TABLES
An Introduction to Tables
The TABLE Element
The CAPTION Element
Table Rows
The TR Element
Table Cells
The TH Element
The TH Element
Table Columns
The COLGROUP Element
The COL Element
Table Headers, Footers and BODY
The THEAD Element
The TFOOT Element
The TBODY Element
IMAGES AND MULTIMEDIA
Including an Image on a Page
The IMG Element
Image Maps
Client Side Image Maps
The AREA Element
The MAP Element
Including an Applet on a Page
The APPLET Element
The BGSOUND Element
The MARQUEE Element
The OBJECT Element
CSS STYLE SHEETS
Introduction to CSS Style Sheets
The World Wide Web Consortium (W3C)
Style Sheets
Inline Style Sheets
Document Level Style Sheets - The STYLE Element
External Style Sheets
External Style Sheets
Linked External Style Sheets
Imported External Style Sheets
Multiple Tag Style Selections
Contextual Tag Style Selections
Style Classes
Regular Style Classes
Generic Style Classes
Style IDs
Hiding Style Data From Web Browsers
Style Precedence
FRAMES
Introduction to Frames
Layout of Frames
The FRAMESET ELEMENT
Nested Frame Sets
The FRAME Element
Setting the Initial Conent of a Frame
Visual Displaying of a Frame
Specifying Target Frame Information
Setting the Default Target for Links
Alternative Content
The NOFRAMES Element
Floating Frames
The IFRAME Element
FORMS
Introduction to Forms
The FORM Element
The GET Request
The POST Request
The INPUT Element
The Input TYPE
Text Fields
Checkbox Fields
Checkbox Fields with Defaults
Radio Buttons
Password Fields
Hidden Fields
Reset Buttons
Submit Buttons
The TEXTAREA Element
The SELECT Element
HTML AND XHTML
The Extensible Hypertext Markup Language (XHTML)
XHTML Document Type Definitions (DTDs)
XHTML Document Creation
DTD Declaration
XML Namespaces
Valid and Invalid XHTML Syntax
REFERENCE
CSS Reference
XHTML Element Reference
XHTML Attribute Reference
Deprecated HTML Elements
Deprecated HTML Attributes
JAVASCRIPT BASICS
Introduction to JavaScript
JavaScript
JScript
ECMAScript
JavaScript
Core JavaScript
Client Side JavaScript
Server Side JavaScript
Dynamic HTML
The SCRIPT Element
JavaScript Basics
External JavaScript
The Scripting Language
The NOSCRIPT Element
Hiding JavaScript
Commenting Scripts
Commenting JavaScript
Commenting VBScript
Commenting TCL Scripts
Debugging Scripts
Debugging JavaScript in Netscape
Debugging JavaScript in Explorer
Intrinsic Events
The Onmouseover Event Handler
The Onclick Event Handler
The Alert Method
JAVASCRIPT STRUCTURE
Case Sensitivity
Whitespace and Line Breaks
Semicolons
Comments
Commenting within XHTML Pages
Reserved Words
DATA TYPES
Numbers
Integer Literals
Octal Literals
Hexadecimal Literals
Floating Point Literals
Special Numeric Values
Strings
String Literals
Escape Sequences
Boolean Vales
Objects
Object Properties
Object Methods
Object Instantiation
Arrays
Creating Arrays
Null and Undefined
VARIABLES
Variable Names
Declaring and Initialising Variables
Variable Scope
Global Variables
Local Variables
VARIABLE MANIPULATION
Data Type Conversion
Number to Strings
Tostring Method
Strings to Numbers
Parseint Method
Pasrefloat Method
Isnan Method
String Manipulation
Cahrat Method
Concat Method
Escape and Unescape Methods
Fontcolor Method
Indexof Method
Italics Method
Lastindexof Method
Slice Method
Split Method
Substring Method
Tolowercase Method
Touppercase Method
Numeric Manipulation
Numeric Constraints
Isfinite Method
Math Functions
Boolean Manipulation
Tostring Method
OPERATORS
Operators and Operands
Operand Data Types
String Operators
Arithmetic Operators
Unary Operators
Relational Operators
Logical Operators
Conditional Operators
STATEMENTS
If / Else
Switch
While Lopp
Do/While Loop
For Loop
Nested Loops
For/In Loops
Lables
Break
Continue
SIMPLE SCRIPTING
Writing HTML
The Document.Writeln Method
IMAGE SWAPPING
Image Swapping
Pre-Loading Images
BROWSER OBJECT MODEL
The JavaScript Browser Object Model (BOM)
Web Page Componetns
Object Properties
Object Methods
Object Events
The Browser Object Model
Window Object
Navigator Object
MimeType Object
Plugins Object
Screen Object
Location Object
History Object
THE DOCUMENT OBJECT MODEL
The JavaScript Document Object Model (DOM)
WINDOW AND FRAME MANIPULATION
Window Manipulation
Window Features
Communicating Between Windows
Properties of Windows
ARRAYS
Arrays
Array Properties
Array Methods
Arrays in the Object Model
FUNCTIONS
Functions
Functions with Parameters
Functions with Return Values
Timing Events
FORM HANDLING
Form Handlers
Field Events
Text Field Events
Checkbox Field Events
Radio Button Fields Events
Select Field Events
COOKIES
What Are Cookies ?
Setting Cookies
Reading Cookies
Deleting Cookies
Complicated Cooking Setting and Reading
Session Cookies
Multiple Cookies
REFERENCE
The Window Object
Window Object Methods
Window Object Properties
Window Object Event Handles
The Frame Object
Frame Object Methods
Frame Object Properties
Frame Object Event Handles
The Document Object
Document Object Methods
Document Object Properties
Document Object Event Handles
Course Environment Development will be performed using:

• XHTML and JavaScript Source Editor
• a text editor such as Notepad, WinEdit or TextPad

Testing Environment

• Internet Explorer or
• Netscape Navigator

Pre-requisites
The developer should be familiar with the host environment - either Windows NT/2000, Windows 95/98 or Windows XP. Knowledge of any programming language would be advantageous, however it is not essential. A basic knowledge of the E-Commerce environment would be beneficial. This can be gained by attending course EC01.

Course Format: Practical sessions make up a large part of the course, allowing delegates to demonstrate and reinforce the lectures given. During these sessions the delegate will gain experience of coding and testing many different types of XHTML web pages containing features such as tables, frames, forms and CSS style sheets. Delegates will also build JavaScript into their web pages to handle forms, dynamically change web pages, set and read cookies. Examples are used extensively, ranging from simple code snippets to full applications with complete 'real world' functionality. These are supplied at the start of the course and it is encouraged that the delegates execute and 'experiment' with these under the instructor's guidance as they are introduced. These examples are available to take away, along with the delegate's own work. The comprehensive Student Guide supplied is fully indexed serving as a useful reference tool long after the course has finished. Delegates will also be able to access a free help-line with technical questions relating to topics covered on the course.