jquery ("foo bar") против jquery ("foo"). find ("bar")

Question

Я пытаюсь пройти xml-документ. Это не работает (ноль результатов):

jquery("foo bar")

это работает:

jquery("foo").find("bar")

есть идеи почему?

Answer 1

jquery("foo bar")

первый ищет элемент bar, являющийся потомком элемента foo

так что в этом примере это будет работать

 <foo>
  <div>Form is surrounded by the green outline</div>
  <label>Child:</label>
  <bar name="thisone" />
  <fieldset>
    <label>Grandchild:</label>
    <bar name="thisone2" />
  </fieldset>
 </foo>

Этот поиск выполняется с использованием выражения jquery

jquery("foo").find("bar")

Начинается со всех элементов foo и ищет элементы строки-потомка

так будет работать в этом примере

<foo><bar>found</bar>, not here?</foo>
<foo>not here <bar>found</bar>.</foo>

так что без вашей разметки вы не сможете точно определить вашу проблему

Answer 2

Важно отметить, что вы пересекаете XML. Хотя ваши примеры верны и соответствуют HTML, я обнаружил, по крайней мере, в IE, что выражения-потомки не работают в XML

На самом деле, я был бы благодарен, если бы кто-то смог подтвердить и объяснить это.

Answer 3

Мне было любопытно, как вы получили противоречивые результаты, поэтому я экспериментировал с разметкой, но не мог придумать способ воспроизвести описанное вами поведение, возвращаемое самим объектом jQuery. Я обнаружил несколько отличающиеся ситуации, которые вызывают такое поведение, например:

<div>
    <span id="span1">Hello World</span>
    <img src="foo" alt="bar" />
</div>

Если вы попробуете этот синтаксис (здесь я пишу "jQuery" вместо использования "$")

jQuery("#span1").parents("div img").css("max-width","25%");  // no good

тогда вы не получите никакого результата, потому что у span1 нет родителя div img, только родителя div. Но это даст результат:

jQuery("#span1").parents("div").find("img").css("max-width","25%");  // will work

потому что он находит родительский div "span1" и оттуда находит изображение, которое является потомком этого родительского div.

Но мой пример надуманный, потому что в этой ситуации вы, вероятно, просто использовали бы

jQuery("#span1").siblings("img").css("max-width","25%");  // will also work, and is clearer