Quick way to find all tds?

[bill]

I'm relatively new to JS so this question is very naive. Is there
a way to quickly get an array of all the HTML elements of a given
class, say all the <td ...>, or all the <font ...> elements? The
only way I can think of involves a tedious tree traversal.

Thanks!

bill

 

[Michael Winter]

I'm relatively new to JS so this question is very naive. Is there
a way to quickly get an array of all the HTML elements of a given
class, say all the <td ...>, or all the <font ...> elements? The
only way I can think of involves a tedious tree traversal.

document.getElementsByTagName(), a DOM method can be used to retrieve
elements by element name. The DHTML equivalent is document.all.tags().
Note that both can be used with any HTML object (such as DIV, TABLE, BODY,
and FORM references) so the browser won't have to traverse the entire tree.

Before using either, you should test for their support:

var tableCells = null;

if( document.getElementsByTagName ) {
tableCells = document.getElementsByTagName('td');
} else if( document.all && document.all.tags ) {
tableCells = document.all.tags('td');
}
if( tableCells ) {
// tableCells is now a collection that contains
// all table cell elements in the document.
}

Mike

 

[bill]

That's great. Thanks!

bill

 

[Michael Winter]

On Thu, 12 Feb 2004 09:39:38 GMT, Michael Winter

[snip]

document.getElementsByTagName(), a DOM method can be used to retrieve
elements by element name. The DHTML equivalent is document.all.tags().
Note that both can be used with any HTML object (such as DIV, TABLE,
BODY, and FORM references) so the browser won't have to traverse the
entire tree.

[snip]

After re-reading that last sentence, I came to the conclusion that it's
rather lacking in detail. What I meant was that getElementsByTagName() is
not just a method of the document object, but of all HTML elements. This
allows you to get all of the table cells of a specific table, for example.
You would first get a reference to the table (using getElementById() or
similar), then call getElementsByTagName() from that object.

Using an example similar to the last one:

var tableRef = null;

if( document.getElementById ) {
tableRef = document.getElementById('myTable');
} else if( document.all ) {
tableRef = document.all['myTable'];
}
if( tableRef ) {
var tableCells = null;

if( tableRef.getElementsByTagName ) {
tableCells = tableRef.getElementsByTagName('td');
} else if( tableRef.all && tableRef.all.tags ) {
tableCells = tableRef.all.tags('td');
}
if( tableCells ) {
// tableCells is now a collection that contains
// all table cell elements in the table, myTable
// (referenced by tableRef).
}
}

Mike