Почему внутренние разделы TABLE должны проходить проверку THEAD TFOOT TBODY? - PullRequest
22 голосов
/ 07 апреля 2011

Я часто использую элементы THEAD, TBODY и TFOOT, чтобы разделить мои таблицы данных на разделы, которые могут обрабатываться отдельно с помощью CSS. Я также понимаю, что всегда есть неявный тег TBODY.

Что меня озадачивает, так это порядок, в который они должны войти, чтобы подтвердить. ЭТА таблица будет проверена:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Table Validation Test</title>
</head>
<body>

<table>

<thead>
<tr>
    <th scope="col">Enemies List</th>
</tr>
</thead>

<tfoot>
<tr>
    <td>&copy; Bomb Voyage</td>
</tr>
</tfoot>

<tbody>
<tr>
    <td>Mr. Incredible</td>
    <td>Elastigirl</td>
    <td>Gazer Beam</td>
</tr>
</tbody>

</table>
</body>
</html>

Но этот не будет:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Table Validation Test</title>
</head>
<body>

<table>

<thead>
<tr>
    <th scope="col">Enemies List</th>
</tr>
</thead>

<tbody>
<tr>
    <td>Mr. Incredible</td>
    <td>Elastigirl</td>
    <td>Gazer Beam</td>
</tr>
</tbody>


<tfoot>
<tr>
    <td>&copy; Bomb Voyage</td>
</tr>
</tfoot>

</table>
</body>
</html>

Действительный - ГОЛОВА, НОГА, ТЕЛО; что не имеет никакого смысла.

Если поставить ногу на дно стола, можно будет провести аналогию между столом и телом человека. Но по какой-то причине этот приказ считается недействительным.

Кто-нибудь знает почему?

1 Ответ

45 голосов
/ 07 апреля 2011

В спецификации указана причина:

TFOOT должен появиться перед TBODY в определении TABLE, чтобы пользовательские агенты могли отобразить ногу до получения всех (потенциально многочисленных) строк данных.

http://www.w3.org/TR/html401/struct/tables.html#h-11.2.3

Я не знаю, действительно ли какие-либо браузеры следуют этому поведению, и оно было изменено в HTML5 для обработки как порядка HTML 4, так и более логичного порядка:

В следующем порядке: необязательно элемент заголовка, за которым следует ноль или более элементов colgroup, за которым необязательно следует элемент thead, за которым необязательно следует элемент tfoot, за которым следует либо ноль или несколько элементов tbody, либо одинили более элементов tr, за которыми необязательно следует элемент tfoot (но всего может быть только один дочерний элемент tfoot).

http://www.w3.org/TR/html5/tabular-data.html

...