Practical prototype and part 23: The information in this book is distributed on an "as is" basis, without warranty Although every pre-caution has been taken in the preparation of this work, neither the author(s) nor Apress shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the information contained in this work. | 122 CHAPTER 6 WORKING WITH THE DOM I find that the DOM approach works best when creating HTML programmatically when the structure or content of the inserted markup isn t the same every time because building long strings in JavaScript isn t my idea of a fun afternoon. For simpler cases innerHTML is easier and faster. Figure out the balance you re comfortable with. The first three methods we ll deal with update replace and insert don t force you to pick one approach or the other. All three can accept either a markup string or a node. Using update Element update changes the contents of an element. Think of it as a thin wrapper around innerHTML just as assigning to the innerHTML property will erase whatever was there before update will discard the original contents of the element replacing it with what you ve given. HTML before p id foo b narf b p JavaScript foo .update span thud span HTML after p id foo span thud span p It boasts several advantages over innerHTML As explained it can take a DOM node or a string. The convenient automatic script evaluation you were introduced to in Chapter 4 also applies to Element update. Any script elements in the inserted markup will be removed the code inside them will be extracted and evaluated after the element has been updated. It gracefully handles some special cases where Internet Explorer tends to choke. For instance most table elements have read-only innerHTML properties as do oddballs like col and select. Let s try a DOM node instead of an HTML string var span span thud foo .update span foo .innerHTML - span thud span CHAPTER 6 WORKING WITH THE DOM 123 CHAINING Prototype s augmentation of DOM node instance methods opens the door to method chaining a syntactic shortcut that makes lines of code read like sentences. Many of the methods in this chapter specifically those that do not need to return other values will return the elements themselves. Consider this code .
