The set of <thead> / <tbody> in the Valid table?

Question

Provide a list of lists like this:

var list = [ { name: 'group1', items: [ 1, 2, 3, 4, 5 ] }, { name: 'group2', items: [ 1, 2, 3, 4, 5 ] }, etc... ] 

Now, forgetting that the whole argument is “tables are for data not design”, I wanted to display one table for list and have a separate <thead> and <tbody> for each entry in the list .

Is it technically sound? It works in a browser, but my spider sensations tingle on that .

Answer 1

You can have as many <tbody> elements as you want, but not more than one of <thead> and <tfoot> . Link :

Content Model:

In this order: optionally a title element, then zero or more colgroup elements, followed by hell an element, followed by either zero or more body elements or one or more tr, and then optionally a tfoot element , optionally mixed with one or more script support elements.

Answer 2

There is no more than one thead and one tfoot allowed , so you should not create additional headers. After all, th in thead gives meaning to your columns, for example, "time of day", "temperature", "the number of cats that are currently on fire."

If the entries in your list are related to each other, they should all be in the same table, and you must specify a title to display this relationship.

If the records are not actually related, you must provide one table for each of them. You can still apply the same CSS to each table to get a good result.

Answer 3

I consider these as id attributes. They must be unique, but you can reuse them on one page, and you can still select them. However, just because it can be done does not mean that it must be done.

I would recommend against him.