AJAX and PHP

Client-Side Techniques with Smarter JavaScript
What Just Happened?
The code is pretty simple. In the HTML code, the important details are highlighted in the
following code snippet:
AJAX Foundations: More JavaScript and DOM
Hello Dude! Here's a cool list of colors for you:
Everything starts by referencing the JavaScript source file using the element. The
JavaScript file contains a function called process(), which is used as an event-handler function
for the body's onload event. The onload event fires after the HTML file is fully loaded, so when
the process() function executes, it has access to the whole HTML structure. Your process()
function starts by creating the HTML code you want to add to the div element:
function process()
{
// Create the HTML code
var string;
string = ""
+ "Black"
+ "Orange"
+ "Pink"
+ "";
Next, you obtain a reference to myDivElement, using the getElementById function of the
document object. Remember that document is a default object in JavaScript, referencing the body
of your HTML document.
// obtain a reference to the element on the page
myDiv = document.getElementById("myDivElement");
Note that JavaScript allows you to use either single quotes or double quotes for string
variables. The previous line of code can be successfully written like this:
myDiv = document.getElementById('myDivElement');
In the case of JavaScript, both choices are equally good, as long as you are consistent
about using only one of them. If you use both notations in the same script you risk ending
up with parse errors. In this book, we will use double quotes in JavaScript programs.
Finally, you populate myDivElement by adding the HTML code you built in the string variable:
36
}
// add content to the element
myDiv.innerHTML = string;
In this example, you have used the innerHTML property of the DOM to add the composed HTML
to your document.
www.it-ebooks.info