ADDING JUST ENOUGH JAVASCRIPT - HTML5 - page 238

Figure 12-2: Opening a second window.
HTML5 ELEMENTS AND THE DOM
In order to give you a better idea of how to work with the DOM in HTML5, certain new
elements require DOM references within the tags themselves. One such new element is the
<output> tag. At the time of this writing, Opera was the only browser that had fully
implemented this new element, so you might want to test it initially with Opera. Before you
incorporate it fully with your site, test it with all the other browsers because you may i nd it
very useful as a key HTML5 element.
242
When you use the <output> tag, you can place the results of a calculation directly on the
Web page. You don't have to build a JavaScript function or even a script. However, the
materials within an <output> tag must follow the same DOM rules as with JavaScript
proper. h e output container doesn't require content between the opening and closing tags.
However, all the calculations must be within the <output> tag itself.
h e output element works in conjunction with the <form> tag that is covered in detail in
Chapter 14, but for now the focus is on the DOM structure in the <output> tag's use. h e
following script ( shoppingOutput.html in this chapter's folder at www.wiley.com/
go/smashinghtml5 ) shows how to incorporate the element in a functional HTML5 page.
<! DOCTYPE HTML >
< html >
< head >
< style type = ”text/css” >
/*042B45,FFC54F,FFE6BF,E8A5B5,FF0A03*/
body {
font - family : Verdana , Geneva , sans - serif ;
background - color : #FFE6BF;
color : #042B45;
}