AJAX In Action [40]
CSS and the DOM complement one another in providing a clear programmatic view of the user interface that we’re working with, while keeping the structure separate from the visual styling. A clean document structure makes programmatic manipulation of a document much simpler, and maintaining a separation of responsibilities is important in developing larger Ajax applications, as we’ll see in chapters 3 and 4.
We’ve shown how to work with the XMLHttpRequest object and with the older XmlDocument and IFrame. A lot of the current hype around Ajax praises XMLHttpRequest as the fashionable way to talk to the server, but the IFrame offers a different set of functionality that can be exactly what we need at times. Knowing about both enriches your toolkit. In this chapter, we introduced these techniques and provided some examples. In chapter 5, we will discuss client/
server communications in more detail.
Finally, we looked at the way the technological pillars of Ajax can be combined to create something greater than the sum of its parts. While Ajax can be used in small doses to add compelling widgets to otherwise static web pages, it can also be applied more boldly to create a complete user interface within which islands of static content can be contained. Making this leap from the sidelines to center stage will require a lot of JavaScript code, however, and that code will be required to run without fail for longer periods, too. This will require us to approach our code differently and look at such issues as reliability, maintainability, and flexibility. In the next chapter, we look at ways of introducing order into a large-scale Ajax codebase. Licensed to jonathan zheng 68 CHAPTER 2 First steps with Ajax 2.8 Resources For a deeper understanding of Cascading Style Sheets, we recommend the CSS Zen Garden (www.csszengarden.com/), a site that restyles itself in a myriad of ways using nothing but CSS. Eric Meyer has also written extensively on CSS; visit his website at www.meyerweb.com/eric/css/. Blooberry (www.blooberry.com) is another excellent website for CSS information. Early Ajax solutions using IFrames are described at http://developer.apple. com/internet/webcontent/iframe.html. The LiveHttpHeaders extension for Mozilla can be found at http://livehttpheaders.mozdev.org/ Danny Goodman’s books on JavaScript are an essential reference for DOM programming, and cover the browser environments in great detail: Dynamic HTML : The Definitive Reference (O’Reilly 2002) and JavaScript Bible (John Wiley 2004). The W3Schools website contains some interactive tutorials on JavaScript, for those who like to learn by doing (www.w3schools.com/js/js_examples_3. asp). Licensed to jonathan zheng Introducing order to Ajax This chapter covers ■ Developing and maintaining large Ajax client codebases ■ Refactoring Ajax JavaScript code ■ Exploring common design patterns used in Ajax applications ■ Using Model-View-Controller on the server side of an Ajax app ■ Overview of third-party Ajax libraries 69 Licensed to jonathan zheng 70 CHAPTER 3 Introducing order to Ajax In chapter 2, we covered all the basic technologies that make up an Ajax application. With what we’ve learned so far, it’s possible to build that super-duper Ajaxpowered web application that you’ve always dreamed of. It’s also possible to get into terrible trouble and end up with a tangle of code, HTML markup, and styling that is impossible to maintain and that mysteriously stops working one day. Or worse, you end up with an application that continues to work so long as you don’t breathe near it or make a sudden loud noise. To be in such a situation on a personal project can be disheartening. To be in such a situation with an employer’s or paying customer’s site—someone who wants a few tweaks here and there—can be positively frightening. Fortunately, this problem has been endemic since the dawn of computing— and probably before that! People have developed ways to manage complexity