Наиболее подходящий способ получить это: $ ($ (". Answer") [0])

Question

Предположим, я хочу получить первый элемент среди всех элементов класса ".answer"

$($(".answer")[0])

Я могу сделать то же самое, но каков лучший баланс между элегантностью и скоростью?

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

Answer 1

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

Похоже, из набора тестов JavaScript , что вашоригинальный метод на самом деле является наиболее эффективным, и вопреки гипотезе о том, что принятый ответ связан с селекторами Sizzle, не относящимися к CSS, как правило, на намного менее эффективен, чем селекторы методов.Есть причина для этого.$('.answer') может использовать собственный браузер getElementsByClass() без необходимости ручного просмотра результатов.Селектор :first усложняет это.В этом случае использование селекторов шипения замедляет выбор в 4-5 раз.

Я бы сказал, что при использовании jQuery производительность должна превосходить элегантность, и все доказательства (каждый браузер, который я тестировал до сих пор!), По-видимому, указывают на то, что неэффективное решение OP является самым быстрым и справедливым.

Вот результаты браузеров с большинством тестовых запусков:

(числа - «операций в секунду», поэтому старшие числа быстрее,младшие числа медленнее.)

Answer 2

Следующие функции эквивалентны по функциональности (но не по скорости):

• var a0 = $($('.answer')[0]);
• var a0 = $('.answer').first(); - см. http://api.jquery.com/first/
• var a0 = $('.answer:first'); - см. http://api.jquery.com/first-selector/
• var a0 = $('.answer').eq(0); - см. http://api.jquery.com/eq/
• var a0 = $('.answer:eq(0)'); - см. http://api.jquery.com/eq-selector/

Что лучше?
выдвинули гипотезу , что версии селектора должны быть быстрее, чем версии метода (и логика имеет некоторый смысл), но я пока не нашел надежного кросс-браузерного, многодокументного тест, подтверждающий это.

И в некоторых случаях вы не можете использовать селектор, так как у вас есть объект jQuery, полученный в результате цепочки результатов, и позже вы должны уменьшить его.

Редактировать : Основываясь на превосходной информации, полученной из тестов @ yc, приведенных ниже, ниже приведены обобщенные результаты текущих (2011-февраль-4) испытаний и сравнение с базовым уровнем .answer:first:

          :first  :eq(0)  .first()  .eq(0)  $($('...')[0])
Chrome 8+   100%     92%      224%    266%       367%
   FF 3.6   100%    100%      277%    270%       309%
  FF 4.0b   100%    103%      537%    521%       643%
 Safari 5   100%     93%      349%    352%       467%
 Opera 11   100%    103%      373%    374%       465%
     IE 8   100%    101%     1130%   1246%      1767%
 iPhone 4   100%     95%      269%    316%       403%
=====================================================
 Weighted   100%     92%      286%    295%       405%
    Major   100%     95%      258%    280%       366%

• Строка Weighted показывает производительность, взвешенную по количеству тестов на браузер; популярные браузеры (среди тех, которые тестируют) учитываются сильнее.
• Строка Major показывает то же самое, только включая не бета-версии основных браузеров для настольных компьютеров.

В итоге: гипотеза (в настоящее время) неверна. Методы значительно быстрее, чем селекторы Sizzle, и почти без исключения код OP $($('.answer')[0]) является самым быстрым из всех!

Answer 3

Используйте селектор :first или метод фильтрации .first:

$(".answer:first");

или

$(".answer").first();