Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why do browsers still inject <tbody> in HTML5?

Tags:

html

HTML5 doctype example.

Both IE9 and Chrome14 log TBODY as the tagName of the element inside the <table>

The HTML5 spec on <table> clearly states :

followed by either zero or more tbody elements or one or more tr elements

Furthermore. The HTML5 spec on <tr> clearly states :

As a child of a table element, after any caption, colgroup, and thead elements, but only if there are no tbody elements that are children of the table element.

Why are browsers corrupting my DOM and injecting a <tbody> when

  • I did not ask for one
  • It's perfectly valid without one

The answer of "backwards compatiblity" makes absolutely zero sense because I specifically opted in for a HTML5 doctype.

like image 655
Raynos Avatar asked Sep 20 '11 19:09

Raynos


People also ask

Why we use tbody tag in HTML?

The <tbody> tag is used to group the body content in an HTML table. The <tbody> element is used in conjunction with the <thead> and <tfoot> elements to specify each part of a table (body, header, footer). Browsers can use these elements to enable scrolling of the table body independently of the header and footer.

Why Tbody is added automatically?

The browser has to correct the code in order to create a DOM hieararchy from it. The code is incorrect, but how much depends on the DOCTYPE that you are using. There is no need to specify the tbody element, it's added automatically.

Is Tbody tag necessary?

Quoting the HTML 4 spec: "The TBODY start tag is always required except when the table contains only one table body and no table head or foot sections. The TBODY end tag may always be safely omitted."


2 Answers

The answer of "backwards compatiblity" makes absolutely zero sense because I specifically opted in for a HTML5 doctype.

However, browsers don't differentiate between versions of HTML. HTML documents with HTML5 doctype and with HTML4 doctype (with the small exception of HTML4 transitional doctype without URL in FPI) are parsed and rendered the same way.

I'll quote the relevant part of HTML5 parser description:

8.2.5.4.9 The "in table" insertion mode

...

A start tag whose tag name is one of: "td", "th", "tr"

Act as if a start tag token with the tag name "tbody" had been seen, then reprocess the current token.

like image 195
duri Avatar answered Oct 22 '22 05:10

duri


You're completely missing the part in the HTML5 spec that specifies how the tree is constructed.

The spec allows you to write a table without the tbody element as it's implied. Just like if you skip the html, head or body opening or closing tags, your page can still be correctly rendered.

I assume you'd like the DOM to contain a body for your content should it be left out for any reason. The same goes for tbody. It's added in because it explicitly assumes you forgot to add it yourself.

The rules for table parsing

A start tag whose tag name is one of: "td", "th", "tr"

Act as if a start tag token with the tag name "tbody" had been seen, then reprocess the current token.

like image 25
zzzzBov Avatar answered Oct 22 '22 06:10

zzzzBov