[...]... sales.rows[1].getElementsByTagName("*"); The Art & Science Of JavaScript (www.sitepoint.com) Fun with Tables 7 Both of these code snippets produce the same results Neither uses any for loops; they’re both two lines long; and they both reach the cells collection through sales.rows[1] But one references the cells collection directly, while the other uses getElementsByTagName Now if speed was our main concern, the first technique would be the. .. appropriate coding strategy in the coming sections Order the print version of this book to get all 250+ pages! 6 The Art & Science Of JavaScript We follow the same principles to access the cells in a table: each row contains a cells collection which, as you might have guessed, contains references to all of the cells in that row So, to access the first cell in the first row of a table, we can write something... are collections of cells There is no tangible HTML element 2 The Art & Science Of JavaScript that represents a column of cells the only elements that come close are colgroup and col, but they serve only as aids in styling the table In terms of actual structure, there are no columns Let’s take a closer look at the simple table shown in Figure 1.1 Figure 1.1 A simple table I’ve styled the table with some... function () { } }(this); The brackets at the end of the main function cause it to be executed as soon as it is loaded by the browser (rather than when the click event is triggered); the parameter passed to the function is the current this keyword, which refers to our TableSort instance Inside the function, we receive the TableSort reference in a variable named that Then, in the scope of the actual onclick... that the language had huge potential, and nowadays, much of the polish that makes a modern web application really stand out is usually implemented with JavaScript If CSS was the darling of the early 2000s, JavaScript has since well and truly taken over the throne In this book, we’ve assembled a team of experts in their field—a veritable who’s who of JavaScript developers—to help you take your JavaScript. .. trip you up along the way Order the print version of this book to get all 250+ pages! The Art & Science Of JavaScript (www.sitepoint.com) Chapter 1 Fun with Tables For the longest time, tables were the tool of choice for web designers who needed a non-linear way to lay out a web page’s contents While they were never intended to be used for this purpose, the row-and-column structure of tables provided... a negative number, a positive number, or zero If the returned value is negative, it means that the first parameter is The Art & Science Of JavaScript (www.sitepoint.com) Fun with Tables 15 smaller than the second If the returned value is a positive number, the first parameter is greater than the second And if the returned value is zero, they’re both the same Here’s how we’d write such a comparison... one with each iteration In a descending loop, the counter is initialized to a value that’s equal to the array’s length minus one, since the array’s index counts from zero The counter is decremented by a value Order the print version of this book to get all 250+ pages! 18 The Art & Science Of JavaScript of one on each iteration, and the loop continues until the counter’s value equals -1 This might seem... will check the item either before or after the current item in the array If there’s an item in that position, our attempt will return true This will allow us to check whether the value of the current item is greater than that of its neighbor If it is, we need to swap the two We also set the variable unsorted to true, as we’ve just made a change in the order of our dataset, and ensure that the item’s... http://developer.yahoo.com/yui/event/ The Art & Science Of JavaScript (www.sitepoint.com) Fun with Tables 11 Figure 1.2 A table ready to be sorted The arrows next to the column headings signify that each column can be used as a basis to sort the table’s data The active column’s arrow is darkened; the inactive columns’ arrows are dimmed to show that, though they’re clickable, they aren’t currently being used to sort the table’s . scope="col">Q2</th> <th scope="col">Q3</th> <th scope="col">Q4</th> </tr> </thead> <tbody> . Sales*</caption> <thead> <tr> <th scope="col">Companies</th> <th scope="col">Q1</th> <th scope="col">Q2</th>