Это действительно плохая идея, чтобы сгруппировать тр-теги с div?

Я разрабатываю приложение с Backbone.js Просмотр класса возвращает один элемент после рендеринга. Это нормально, если я использую divs или spanans. Но проблема начинается, когда я начинаю визуализировать объекты как tr строк. Один объект должен быть отображен в 2-3 строки. Могу ли я использовать эту структуру?

<table>
    <div>
        <tr>...</tr>
        <tr>...</tr>

    </div>
</table>

Ответы

Ответ 1

divs непосредственно внутри тега таблицы недействительны. вместо этого использовать tbody

Ответ 2

Да, это очень плохая идея.

Спецификация HTML не позволяет элементам div быть дочерними элементами элемента таблицы, поэтому он запускает процедуры восстановления ошибок в браузерах.

Учитывая этот вклад:

<table>
  <tr><td>1</td></tr>
<div>
  <tr><td>2</td></tr>
  <tr><td>3</td></tr>
</div>
  <tr><td>4</td></tr>
<div>
  <tr><td>5</td></tr>
  <tr><td>6</td></tr>
</div>

DOM, который создаст Firefox (и вы увидите это с помощью функции Inspect Element), будет выглядеть так:

<div>
  </div><div>
  </div><table>
  <tbody><tr><td>1</td></tr>
<tr><td>2</td></tr>
  <tr><td>3</td></tr>

  <tr><td>4</td></tr>
<tr><td>5</td></tr>
  <tr><td>6</td></tr>

</tbody></table>

Обратите внимание, что элементы div были удалены из таблицы и помещены перед ним. Это делает их бесполезными для манипулирования строками.

HTML предоставляет элементы thead, tfoot и tbody для группировки строк таблицы. Используйте соответствующие из них вместо элементов div (у вас может быть только один аэд и только один tfoot, но нет ограничений на количество элементов tbody).

Ответ 3

Это недействительно HTML. Вы не можете вставлять блок или встроенные элементы в таблицу, только элементы таблицы, такие как <tbody>, <tr> или <thead>. Конечно, вы можете <div> ячейку <div> в ячейку таблицы (<td> или <th>).