JAVASCRIPT DOM & AJAX

Loops employ the For, While and Do-While methods and enter into a linear process until one of the conditions of the loop are satisfied to break the loop. The values within a loop are outside the context of the normal procedure, and if employed, becomes an auxilary procedure. Loops are therefore auxilary procedures.

Guessing Game Loops demonstrates a while loop as an interactive guessing game, where you will pick a random number between 1 and 10

H1 to H6 Loops script uses a for loop and the + operator to write out a message

Odd and Even Loops script introduces the modulus operator to write the odd and even numbers of each pass up to 10

Pass Loops is a demonstration of a pass loop, which writes each pass up to 20

Tables Loops demonstrates how to use a loop function and document.write to dynamically draw a table

Interactive Random Counts prompts you for a number and then by pressing the "calculate" button performs a loop. The loop will stop when the number you typed is reached

Conditionals employ IF ELSE constructs over the scope of variables to calculate various dynamic results. This IF-ELSE / Variable formula distinguishes conditions-based logic to cause an effect.

If Else Statements is a simple script that displays one string after the other using If Else

If Else and the Modulus divides one number into another, like 3 into 12, and yields the result

Assessing Your Age prompts for your age and gives a suitable message for five age groups. Also prompts for your school grade and displays a suitable message for their performance

parseInt Calculations demonstrates whether the number you type is positive, negative or zero

Functions and Event Handlers combined form a synergistic process that seeks to change or reflect the status of an object/s. This is done through user-interaction or through timed events. These processes are distinguishable by being triggered at a "designated time" to cause an effect.

Greeted Twice calls functions in the head from event handlers in a body script to greet two people based on the variables provided.

Invoke Function passes a variable as an argument to a function and writes the results in a string

parseInt and Prompt Calculations will add the four numbers given and display them in a result

Background Color Changes uses event handlers to change the picture and background color to alternatives via DOM methods. You can change them back by clicking on the "change back" button

Images As Buttons uses three images and a function to calculate the image clicked and write a custom display

Anything that has its own class of unique properties is an object.Javascript offers three commonly used built-in objects - the array object, date object and string object. Each object comes with its own properties, methods and event handlers. Several methods are available to manipulate strings. The examples below demonstrate the distinguishable features of these string object methods.

String Exercise uses the string command with various dot syntax to manipulate the actual return of the string's value

parseFloat Function is a built-in JavaScript function to deal with the conversion of strings to numbers.

Split Method prompts a user to type a couple of words separated by spaces where the split() method splits the string into a new array, delimited by commas. The delimited array is then displayed in an alert box.

Students String uses the split() method on a predetermined array and returns the midterm grade and final grade of a student in an alert box.

Another commonly used built-in object is the array object. This takes the the concept of variables further to store more than one value to one container. The ability to store multiple values in one variable allows the classification of pseudo-objects, where the array object has many custom properties and those custom properties many uses and interpretations that define how they are evaluated in conditionals.

Concat() method applies the concat() method to combine the elements of 2 or more arrays and creates another array in doing so

Join() method applies the join() method to join all the elements of an array into a single string separator, displayed as an alert

Concat() and Pop() method combines both Concat() and Pop() methods to concatenate elements into one array. It also removes elements and stores them in a new variable for later use.

Push(), Shift(), Reverse(), Slice() and Splice() methods demonstrates the Push() method to add new elements to an array; the Shift() method to remove the first element from an array; the Reverse() method to reverse the order of an array; the Slice() method to remove elements from the middle of an array; and the Splice() method to actually remove and delete elements from the original array.

Array Object Length Property some Array methods remove the last element of an array so it is important to measure the length of any array with the length property.

Open New Window demonstrates the open()and close() methods to open a new window, and close the current window.

Parent & Child Windows examines parent and child windows and the manner in which DOM can update the parent window with text written in the child window. The screen object method also gathers basic information about the screen of your visitor.

Image Rollover uses a second image when the mouse rolls over the original image, producing a rollover effect. A link to another website or address is also added to the image.

Mouseover Alters Background Color demonstrates how a script can change the background color attribute by rolling over a link

Three State Image Rollovers uses a javascript preload feature to cache the alternate rollover images, and the DOM to retrieve the cached images so there is no lag between image loads.

Scripted Image Gallery is an introduction to DOM scripting techniques in how to create a simple image gallery using the getAttribute() and setAttribute() methods.

Navigate the DOM demonstrates DOM traversal methods using the nextSibling & previousSibling properties of DOM.

Dynamic Web Page demonstrates how to dynamically create a web page using DOM methods. The source will reveal no tags between the <body> </body> tags. Four main methods createElement() createTextNode() appendChild() setAttribute() are used in conjunction with the getElementById() DOM detection method.