views:

508

answers:

4

Hi!

I am trying to select the first row of a table. Note: the first row is wrapped in a thead tag, so:

<table>
  <thead>
    <tr>  <!-- first row --> </tr>
  </thead>
  <tbody>
    <tr>  <!-- body --> </tr>
  </tbody>
  <tfoot>
    <tr>  <!-- body --> </tr>
  </tfoot>
</table>

The 'select first row' tip could work if it wasn't for the wrapper tags. This is what I have tried but doesn't work:

 $("*:not(thead)", tableSelector).remove();

I.e., I would like to get rid off both tbody and tfoot selectors using a "not tfoot" selector. Because I want to remove everything else from the table except the <thead> and everything-inside-thead. So basically what I am trying to do is to select everything except thead and what's inside it; intutuively something like :not(thead *) could work, but doesn't.

My workaround is $("tbody, tfoot", tableSelector).remove(); but I would like to learn and understand how to use the opposite (not-selector).

+4  A: 

Your question isn't exactly clear. To select the first row in a single table:

$("table tr:first")...

or the reverse:

$("table tr:not(:first)")...

will do it but that will break if there's more than one table (it will only select one row even if there are three tables). You can work around that with:

$("table").each(function() {
  $(this).find("tr:first")...
});

You can get all rows not in THEAD with:

$("table > :not(thead) > tr")...

Edit: I think you're over-complicating this. If you want to remove everything except THEAD and its contents, that's relatively simple:

$("table > :not(thead)").remove();

If you want to leave the TBODY and TFOOT elements in place change it to:

$("table > :not(thead) > tr").remove();
cletus
Ok, to be clear. Select first row TOGETHER WITH ITS THEAD.Because I want to remove everything else from the table except the `<thead>` and everything inside thead.
Martin
+1 for the "Your question isn't exactly clear" ;-)
frunsi
+1  A: 

Using children() on the table selector will select only the direct children. You can filter this using your not selector.

$(tableSelector).children(':not(thead)').remove();
tvanfosson
This one is actually about 30x slower than using a selector-only solution.
vrutberg
Care to explain that? My simple testing shows me that your solution takes on average 400ms for 1000 iterations and mine takes a little over 300ms for the same 1000 iterations.
tvanfosson
...note that in my test I was doing hide/show rather than remove for the obvious reason.
tvanfosson
My test case looks like this: http://pastebin.com/f48b2490bThe first one, "selector", takes ~1500ms on Firefox 3.5.5 (W32), while the second one, "children", takes ~45000ms.
vrutberg
Wait what... Scratch that, now that I run it again your children method is about 1.2x faster. I apologize. <:)
vrutberg
FURTHERMORE it is more difficult to parametrize this... ;) Giving a selector string is nice.. can this be done using selector only?
Martin
@Martin -- I was using your code as an example which is based on the tableSelector context. If you want to select it using just a selector string try $('table#myTable > :not(thead)'), assuming that your table id is `myTable`. This incorporates the table selector directly into the query.
tvanfosson
A: 

I am trying to select the first row of a table.

Why not use good old DOM?

mytable.rows[0]
bobince
I want the THEAD to come along so plain rows don't cut it.
Martin
Furthermore, I want to remove everything else from the table so just selecting rows doesn't get me anywhere.
Martin
A: 

If you want to remove any child of a table except thead, try this selector:

table > *:not(thead)


Edit    Since you pointed out that you already have the table in a variable:

$("> *:not(thead)", context)
Gumbo
Again, I want to use the conetxt specifier. $(xx, context)
Martin
No.. this does not work either. It removes everything. Only "tbody, tfoot" seems to work until now.
Martin
@Martin: And the context is really just your table? Like `$("table")`?
Gumbo
Well, the table has an id <table id="xx"> and var context = $("#ixx")...
Martin
Sorry, typo -> context = $("#xx")
Martin