Как работает множественный выбор в этом примере?

Question

Соответствующий фрагмент HTML:

<span class="a">
<div class="fieldname">Question 1</div>
<input type="text" value="" name="q1" />
</span>

Соответствующее jQuery:

$.each($('.a'), function(){
$thisField = $('.fieldname', $(this));
});

Что именно устанавливается на $thisField? Если я правильно понимаю множественные селекторы в jQuery, он должен захватить внешний элемент <span> И внутренний элемент <div>. Но по какой-то причине, если я использую $thisField.prepend("hi");, это заканчивает тем, что ставит hi прямо перед текстом Question 1, но не перед <div>. Я думал, что несколько селекторов захватят оба элемента, и что prepend() добавляет hi к началу ОБА элементов, а не только к <div>

Answer 1

Соглашение о вызовах, которое вы используете, не является «множественным селектором», оно фактически ищет в контексте ($(this)) селектор ('.fieldname'). См. Документы .

Вы можете сделать это, чтобы получить <div> и <span>:

$(this).find('.fieldname').andSelf().prepend('hi');

Answer 2

$('.fieldname', $(this)); эквивалентно $(this).find('.fieldname');

не путайте это с чем-то вроде: $('.class1, class2');.

$('.class1, class2'); имеет только один введенный параметр.

Answer 3

$.each($('.a')

означает «для каждого элемента, у которого есть class = a» (в данном случае, только ваш диапазон), поэтому, если у вашего div тоже есть class = a, вы увидите ожидаемый результат.

Answer 4

Несколько селекторов работают внутри селектора строка ..

как это

$multiple= $('.fieldname, a'); 
// this will select all <a> elements and all elements with class 'fieldname'

Answer 5

Я не уверен, что вы имеете в виду с несколькими селекторами, потому что я вижу, что вы делаете, просто выбирая <div class="fieldname">. Все, что .prepend делает, это добавляет hi перед содержимым этого div.

Таким образом, здесь вы не выбираете более одного элемента.

Answer 6

Но по какой-то причине, если я использую $thisField.prepend("hi"); это заканчивается Привет прямо перед текстом Question 1, но не раньше <div>.

Вы пробовали это?

$.each($('.a'), function(){
  $('hi').insertBefore($('.fieldname', $(this)));
});

Answer 7

"Метод .prepend () вставляет указанное содержимое в качестве первого дочернего элемента каждого элемента в коллекции jQuery" http://api.jquery.com/prepend/

, поскольку вы нацеливаете все элементы с классом "fieldname" внутри элементау которого есть класс "a", вывод правильный.