HTML and CSS Reference
To update the value of an <output> element, you can set the value property:
element . value = newValue ;
What to do for browsers that don't support <output>
To access the element in browsers that don't support <output> , you'll need to give the
element an ID and use document.getElementById instead:
var element = document . getElementById ( 'outputid' );
To update the value of the element, set the innerHTML property:
element . innerHTML = newValue ;
Let's add the code you need to update the totals in your order form example.
Step 4: Display updated totals on the order form
Add the code from the next listing to app.js, right after the code from the previous listing
and before the terminating bracket of the for loop.
Listing 2.10. app.js—Displaying updated totals using the <output> element
Try it out!
At this point, the calculation of item line and overall order total values should be working.
Load the page in a modern browser and try changing the value of the quantity fields—you
should notice the totals change accordingly. This is demonstrated in the screenshot in figure