selecting root element in jquery

Question

I need to be able to select the root element from a fragment without knowing the node types, class, id or hierachy.

Answer 1

Whilst this question was answered a while ago perfectly correctly - I was just trying to attempt this myself and wasn't too keen on using a selector like *:not(* *) -- mainly because of the probable overheads. I don't know if this is a recent addition to jQuery's ability (i'm using 1.8) but you can use:

$(':eq(0)');

This will select the first found non-textnode element, so unless the dom you are traversing is illegal in it's formation, you should always get the root element. It is also highly optimal because jQuery should know to stop after the first element found.

So here's a little something for all of those WSOD fans out there:

$(':eq(0)').remove();

Oh and just in case it isn't obvious that the above code snippets were just illustrating the selector, and you find yourself working with a partial fragment (rather than the full document), then you should use this selector with jQuery's filter method:

$(fragment).filter(':eq(0)');

However, when working with fragments you can just do the following:

$(fragment).get(0);

Although bear in mind that .get(0) can select text/comment nodes if they are the first item in your document, whereas the filter approach will always find the first actual element.