JQuery-эквивалентный для прототипов вниз ()-функция

StackOverflow https://stackoverflow.com/questions/3989512

  •  10-10-2019
  •  | 
  •  

Вопрос

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

Смотрите на jquery-api одним из способов сделать это:

Прототип: $ ('abc'). Down (); jquery: $ ('abc'). children (). First ();

Тем не менее, поскольку это первым приносит всех детей и применяет фильтр, я сомневаюсь, что это эффективно для этого варианта использования.

Что лучше?

Это было полезно?

Решение

Вы можете расширить jQuery и добавить down() функционируйте так:

(function($) {
  $.fn.down = function() {
    return $(this[0] && this[0].children && this[0].children[0]);
  };
})(jQuery);

Таким образом, вам не нужно ничего менять в своем коде.

Вы можете увидеть это вживую Пример JSFiddle.
Также вы можете просмотреть сравнение производительности в Jsperf.
Это показывает это это быстрее чем методы, представленные в других ответах (которые от 40% до 70% медленнее).

РЕДАКТИРОВАТЬ:
Альтернативная версия, адаптированная из фактической реализации прототипа. Это даже быстрее (на 25%)

(function($) {
  $.fn.down = function() {
    var el = this[0] && this[0].firstChild;
    while (el && el.nodeType != 1)
      el = el.nextSibling;
    return $(el);
  };
})(jQuery);

Другие советы

Есть несколько способов сделать это.

Во -первых, это возвращает массив, содержащий одиночный элемент.

$('form').children().first();

Также обратите внимание, что это более читаемая версия$('form').children(":eq(0)");

Во -вторых, это возвращает только элемент, извлеченный из массива

$('form').children()[0];

Или если вы знаете, какой тип элемента ваш после (а не просто первого ребенка независимо от типа элемента), вы можете использовать:

$('form').find("input:first");

Наконец, если вам не нужен элемент по сравнению с его родителем, вы можете просто получить доступ к нему напрямую, используя селектор CSS3:

$("input:first");

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

пытаться:

$('abc').children(":eq(0)")
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top