93Chapter 14 .Document Object Model Essentials The conservative (Web hosting isp)
Monday, August 27th, 200793Chapter 14 .Document Object Model Essentials The conservative approach In the first scenario, the content requires a modest level of data entry interaction with a user via a form as well as image rollovers. Supported browsers encompass the entire range of nonscriptable and scriptable browsers, with one version of each page to serve all visitors. If the form gathers information from the user for submission to a server CGI that stores the data in a database or performs a search based on user-supplied criteria, the obvious mode of entry is through traditional form elements. Scriptable browsers can perform pre-submission validations to hasten the correction of any improperly formatted fields. Event handlers attached to the text fields (onChange event handlers) and an onSubmitevent handler for the form itself can do the validation on the client. Nonscriptable browsers ignore the event handlers, and the form is submitted as usual, relying on server-side validation of input data (and the slow back-and-forth processing that this entails when there is an error or missing field data). For image rollovers, links surround the image elements. The onMouseOverand onMouseOut event handlers for the links trigger functions that swap images. By wrapping the statements in the event handler functions in if constructions that test for the presence of the document.imagesarray, first-generation scriptable browsers that don t implement images as objects perform no action: function imageOn(imgName) { if (document.images) { document.images[imgName].src = onImages[imgName].src } } The same goes for script statements in the Head that precache the swappable images as the page loads: if (document.images) { var onImages = new Array() onImages[ home ] = new Image(50,30) onImages[ home ].src = images/homeOn.gif … } This scenario can also provide added content on the page for scriptable browser users by embedding scripts within the body that use document.write() to generate content as the page loads. For example, the page can begin with a time-sensitive greeting ( Good Morning, Good Afternoon, and so on), while nonscriptable browser users see a standard greeting inside the