15.02.2013 Views

JavaScript Examples Bible - UserWorks Technologies

JavaScript Examples Bible - UserWorks Technologies

JavaScript Examples Bible - UserWorks Technologies

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

384<br />

<strong>JavaScript</strong> <strong>Examples</strong> <strong>Bible</strong>: The Essential Companion to <strong>JavaScript</strong> <strong>Bible</strong><br />

TABLE.cellPadding<br />

function swapColors(tableRef) {<br />

var oldLight = tableRef.borderColorLight<br />

tableRef.borderColorLight = tableRef.borderColorDark<br />

tableRef.borderColorDark = oldLight<br />

}<br />

While you can easily invoke this function over and over by ending it with a<br />

setTimeout() method that calls this function after a fraction of a second, the<br />

results are very distracting to the person trying to read your page. Please don’t do it.<br />

caption<br />

NN2 NN3 NN4 NN6 IE3/J1 IE3/J2 IE4 IE5 IE5.5<br />

Compatibility ✓ ✓ ✓ ✓<br />

Example<br />

The following example, for use with The Evaluator (Chapter 13 in the <strong>JavaScript</strong><br />

<strong>Bible</strong>) in NN6+, demonstrates the sequence of assigning a new CAPTION element<br />

object to a table. While the table in The Evaluator already has a CAPTION element,<br />

the following statements replace it with an entirely new one. Enter each of the<br />

following statements into the top text box, starting with the one that saves a long<br />

reference into a variable for multiple uses at the end:<br />

t = document.getElementById(“myTable”)<br />

a = document.createElement(“CAPTION”)<br />

b = document.createTextNode(“A Brand New Caption”)<br />

a.appendChild(b)<br />

t.replaceChild(a, t.caption)<br />

A view of the table shows that the new caption has replaced the old one because a<br />

table can have only one CAPTION element.<br />

cellPadding<br />

cellSpacing<br />

NN2 NN3 NN4 NN6 IE3/J1 IE3/J2 IE4 IE5 IE5.5<br />

Compatibility ✓ ✓ ✓ ✓<br />

Example<br />

Use The Evaluator (Chapter 13 in the <strong>JavaScript</strong> <strong>Bible</strong>) to adjust the<br />

cellPadding and cellSpacing properties of the demonstrator table. First, adjust<br />

the padding (IE5+/NN6 syntax):<br />

document.getElementById(“myTable”).cellPadding = 50

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!