Is there a sexier way to write this jQuery selector?

Question

I want to select all the children of the body element before element with id foo (which is a child of body). Since it doesn't look like there are :before() or :after() selectors, I've got it working like this:

$('body > :first').nextUntil('#foo').andSelf();

but it seems kludgy. Could this be done with fewer function calls, or more efficiently? Maybe something akin to $('body > *:before(#foo)') ?

Answer 1

it's not that kludgy. Infact, using your example with "*" within the selector is WAY slower than calling functions.

So, I would suggest using one function more in your original selector:

$('body').children().first().nextUntil('#foo').andSelf() 

most of those functions use a simple array slice to reduce the set, where selecters have to traverse the DOM.

Kind Regards

--Andy

Answer 2

I'm guessing that you could be new to jQuery? When I was new, It took me a while to get used to how everything was written, and that the semantics of JavaScript won't look as nice as nested HTML, etc. Eventually you'll get used to it, and efficiency will look the sexiest to you!

Happy coding!