jquery says tbody.length = 1 even though no tag is present

Question

i have a very simple table with the bare minimum of html-tags, like e.g.:

<table id="test">
    <tr><td>some table cell</td></tr>
</table>

i am trying to check whether a tag is present. the odd thing is: jquery says "yes, there is a tbody tag" even though i have not defined one! what is happening here?

$('table#test').each(function(){

    var tbody = $(this).find('tbody');

    //how can there be a tbody when there is no <tbody> tag defined?
    console.log(tbody.length); //gives 1, should be 0 though as there is no tbody

});

tested in Chrome 28.0, Firefox 22.0 using jQuery 1.6.4 (as current project requires it though it also happens in jQuery 2.0.2)

here is also a jsFiddle: http://jsfiddle.net/nerdess/rH5Lf/

some browsers automaticallty add tag, maybe you should use count instead — Nitin Sawant, Aug 13 '13 at 12:59
http://stackoverflow.com/questions/938083/why-do-browsers-insert-tbody-element-into-table-elements — zahirdhada, Aug 13 '13 at 12:59

score 7 · Accepted Answer · answered Aug 13 '13 at 12:59

7

tbody adds automatically in table, you could see that tbody is there by right clicking and view component (chrome developer tools)

<table id="test">
    <tbody>
        <tr>
            <td>some table cell</td>
        </tr>
    </tbody>
</table>

answered Aug 13 '13 at 12:59

Anton

32,245
5
44
54

score 3 · Answer 2 · answered Aug 13 '13 at 13:01

3

The tbody element is required for the document to be valid, therefore most browsers will add it in if it's missing. If you inspect the document using Firebug or the Chrome dev tools you'll see it in the rendered source.

If you can edit your question with more detail about what you're trying to achieve, we can suggest alternative methods.

answered Aug 13 '13 at 13:01

Rory McCrossan

331,213
40
305
339

i need to append additional rows to the table and was checking whether a tbody exists: if yes then append the rows to tbody, if no then append the rows directly to the table. while implementing that i was just baffled to see that tbody.length was always 1, even if there was no tbody in the markup (and even in IE7...) – nerdess Aug 13 '13 at 13:09
1

In that case you don't need to worry about there being a `tbody` if you append a `tr` to the `table` element jQuery/the browser will automatically place it within the correct element (the `tbody`) – Rory McCrossan Aug 13 '13 at 13:11
sweet, thx! will adjust my code :) – nerdess Aug 13 '13 at 14:21

score 1 · Answer 3 · answered Aug 13 '13 at 13:10

The tbody elements identifies the range of the row groups. If there's no tbody element present in the table then the collection of tr elements treated as a single group and so wrapped under a single tbody element in Dom element representation of jquery. This is why you're seeing the tbody count as 1.

score 1 · Answer 4 · answered Aug 13 '13 at 13:10

The standard says:

TABLE is not actually allowed to contain TR elements directly, they must be contained in THEAD, TFOOT or TBODY. But for simplicity and backwards compatibility, the start tag of TBODY may be omitted "when the table contains only one table body and no table head or foot sections"; in which case the element is inferred by the browser.

Check here, you will see that tbody is somehow required: http://www.w3.org/TR/html4/sgml/dtd.html

(CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)>

jquery says tbody.length = 1 even though no tag is present

4 Answers4