The basics of the DOM are already talked about in a previous post so lets show another field the DOM method operates in.
For our Week 11 lectures in Programming I, at Kansas State University we used the DOM method to demostrate how the DOM makes changes to content, like turning a upset “sad” face image that is linked through wikimedia to a smiling “happy” face by clicking a button.
In the first picture you can see the button whose “onclick” event calls the function that changes the faces. Located in the second picture you can see the HTML that calls the first picture.
You can see within this function that “//lesson three…” changes the source of img01, which is the frowning face, to a source of a smiling face. The function changes other aspects of the HTML as well, however, the images changes was the most influential part of this lesson and the easiest to digest therefore I thought it would be more interesting to read. Here is the end result: