Course Description
This 2-day JavaScript Programming Advanced training course will teach students advanced JavaScript techniques and good standard coding conventions. Students will also learn advanced form validation with Regular Expressions, to manipulate the HTML DOM and to create jump menus and cascading select menus. Finally, students will learn how to manipulate CSS with JavaScript to create applications using Dynamic HTML.
Pre-requisites
Experience in HTML and basic JavaScript. Attendance at our JavaScript Programming Introduction training course, or equivalent experience.
Who is this course for?
Students who are already familiar with the fundamentals of JavaScript programming and who want to learn about the more advanced features that are available.
Further Training
After some further on-the-job programming experience with the JavaScript language, we recommend students attend our
JavaScript Programming Advanced training course to gain higher-level skills in the usage of JavaScript.
Course content
Quick JavaScript Recap
Native Types
Functions
The DOM
JavaScript is not the DOM
The window object
The XMLHttpRequest object
JSON
Advanced Techniques
Truthy and Falsy
Default Operator
Default Operator Gotcha!
Functions Passed as Arguments
Anonymous Functions
Inner Functions
Observing and Capturing Events
The eval() Function
Variable Scope
Error Handling
The delete Operator
Regular Expressions
JavaScript’s Regular Expression Methods
Flags
String Methods
Regular Expression Syntax
Start and End ( ^ $ )
Number of Occurrences ( ? + * {} )
Common Characters ( . \d \D \w \W \s \S )
Grouping ( [] )
Negation ( ^ )
Subpatterns ( () )
Alternatives ( | )
Escape Character ( \ )
Backreferences
Form Validation with Regular Expressions
Cleaning Up Form Entries
The HTML Document Object Model
Accessing Element Nodes
getElementById()
getElementsByTagName()
getElementsByClassName()
querySelectorAll()
querySelector()
Accessing Element and Text Nodes Hierarchically
Attaching Events
Event Propagation: Capturing and Bubbling
Detaching Events
Accessing Attribute Nodes
Accessing Nodes by Type, Name or Value
Removing Nodes from the DOM
Advanced JavaScript
Programming
DOM Differences: The Whitespace
Problem
Creating New Nodes
Identifying the Target of an Event
Dynamic Forms
The options[] Collection
The selectedIndex Property
Disabling Form Elements
Adding Options to a Select Menu
Cascading Select Menus
Making the Code Modular
Creating a JavaScript Timer
Dynamic HTML
Accessing and Modifying Styles
JavaScript style Properties
Hiding and Showing Elements
Manipulating Tables
Dynamically Changing Dimensions
Creating a Timed Slider
Positioning Elements Dynamically
Creating a Different Timed Slider
Changing the Z-Index
A Note on JavaScript Frameworks