Web Development with jQuery®

(^132) ❘ CHAPTER 4 MANIPULATING CONTENT AND ATTRIBUTES
var tr = $('tr#johnLennonAlbumTemplate').clone(true);
tr.removeAttr('id');
$('table.johnLennonAlbums tbody').append(tr);
tr.children('td:first').focus();
}
);
}
);
Figure 4-20 shows the preceding example. When you click the Add a Row button, a new row is
added to the table to input a new John Lennon album.

FIGURE 4-20

The following line clones the template element, with id name johnLennonAlbumTemplate.

var tr = $('tr#johnLennonAlbumTemplate').clone(true);

If any event handlers are attached to the <tr>, or the <td> elements it contains, those event han-

dlers are carried over to the new duplicated <tr> element because the fi rst argument provided to the

clone() method is set to true.

The id attribute is removed so that the new <tr> element isn’t treated like the template <tr> element,

which is not displayed in the document.

tr.removeAttr('id');

The new element is appended to the element using the append() method.

$('table.johnLennonAlbums tbody').append(tr);

http://www.it-ebooks.info