Operator precedence in selectors

Question

When I write:

$(tableElement).find("thead input,img")

Will jQuery match inputs inside theads and also images?

Or will it match inputs inside theads and also images inside theads?

More general, what is the operator precedence in jQuery selectors? I could not find it anywhere.

Update:

Given the precedence, can I use parenthesis, or some other way to change it inside the selector string?

When I wrote precedence, I was talking about the precedence at which the selector string operators are parsed by jQuery, not anything about which elements are included first in the resulting jQuery collection.

Answer 1

The selector is totally clear. You are asking it to find:

tableElement    // The table element's
  thead input   // inputs under thead of table element and
  img           // images under the table element

This is like:

.tableElement thead input,
.tableElement img {
}

It selects the images under the table element and inputs under the thead, which is under the table element. I am not sure what's the precedence here.

---

If you want something like both under the same parent, you need to use:

$(tableElement).find("thead").find("input, img")
$(tableElement).find("thead input, thead img")

The above will translate to:

.tableElement thead input,
.tableElement thead img {
}

This code will get both the img and input inside the thead present under the tableElement.

---

When I wrote precedence, I was talking about the precedence at which the selector string operators are parsed by jQuery, not anything about which elements are included first in the resulting jQuery collection.

Okay, to answer your latest question, there's no particular order. It's totally unordered and selects everything. jQuery just follows the CSS selector. It doesn't have any particular parsing order. Internally, everything is a querySelectorAll() and looping.

Answer 2

In general - a comma in jQuery is a separator.

Every part of the string is evaluated alone, and then combined, so in your example - you are looking for thead input AND img INSIDE $(tableElement).

As for the precedence - they will return in their place inside the DOM.