Every element in a document is an object. Every one of these objects has a whole collection of properties as we have discussed in previous meetings. There’s one property called style which every element node has. It contains information about the styles attached to the element. Querying this property doesn’t return a simple string, it returns an object. Style information is stored as properties of this style object:
element.style.property
Many sites that present tabular data use alternating background colors to increase the readability of that data. The obvious solution is to hardcode every second row to ensure it had a different background color. But if you want the table to be dynamic, meaning that it would be possible to add a new row in the middle of the table without changing the background color attribute of the rows that followed requires a little JavaScript.
One way to enhance a table style is to introduce a hover effect on the table rows: when the user is moving across the table with their mouse, the current row they are on will change color. This is something that you frequently see in interface design in internal web applications which help users view a particlar row of data.
