Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
315 views
in Technique[技术] by (71.8m points)

html - What is the best way to style alternating rows in a table?

Obviously, the actual style of the odd/even rows will be done via a CSS class, but what is the best way to "attach" the class to the rows? Is is better to put it in the markup, or is it better to do it via client-side javascript? Which is better and why?

For simplicity's sake, let's assume that this is a large table, 100 rows, and that the color scheme is alternating odd/even rows. Additionally, some sort of javascript library that can easily do this is needed elsewhere in the page and so the overhead of that package is not a factor.


The real goal of this question is to determine what trade-offs are involved as well as how those trade-offs should be handled, such as performance hits to the server if the page is hit under load(assume a dynamic table), bandwidth hits for users with lower connection speeds, semantic hits by adding additional layout code to the HTML (The idea here is that HTML is for content, CSS is for layout, and javascript is for how the content behaves as well as controlling/augmenting the layout)

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You can do this fairly easily with jQuery, like so:

$(function(){
    $('tr:even').addClass('alternateClass');
    $('tr:odd').addClass('mainClass');
});

You can qualify the selector a bit more if you just want to do this on one particular table, or do it on 'li' elements as well.

I think this is a bit cleaner and more readable client-side than it would be in some server-side environments,


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...