HTML and CSS Reference
Now it's time to put it all together and see what happens (see UserObject.html in this
chapter's folder at www.wiley.com/go/smashinghtml5 ):
<! DOCTYPE HTML >
< html >
< head >
AddingMachine = new Object ();
AddingMachine . firstNumber = 4 ;
AddingMachine . secondNumber=66 ;
AddingMachine . total = function ()
document . write ( this . firstNumber + this . secondNumber );
//Fire off the method!
AddingMachine . total ();
< meta http - equiv = ”Content-Type” content = ”text/html; charset=UTF-8” >
< title > Simple Object </ title >
</ head >
</ html >
Note that the method AddingMachine.total() uses the method document.write() .
the method, the name of the object and function are listed and of it goes. When you test it,
you'll see that the results are the total of the two properties.
Back to the Document Object Model and browser objects
h is chapter has covered a lot of territory very quickly. In fact, the last section is the i rst step
in Object-Oriented Programming (OOP). So, if you didn't pick up everything, don't worry.
h e purpose is to make you more comfortable with the DOM in HTML5. If you understand
terms like properties and methods, they won't seem as foreign.
As we get into many of the newer features in HTML5, you'll be better able to navigate through
all the terms and understand what's going on. In other words, it'll be easier to learn. h at
doesn't mean you have to become an OOP programmer to understand this stuf . It just means
that a little OOP goes a long way toward helping you understand the DOM and browser
objects that come in handy when using elements like canvas .
h roughout the topic, you've seen objects that belong to the browser. I didn't discuss them as
such, but that's what they are. h e browser has the following objects that are important to
using HTML5. Included are the following: