Я видел много дискуссий относительно самого быстрого способа выбрать первый дочерний элемент, используя jQuery. Как и следовало ожидать, собственное свойство DOM firstChild намного быстрее, чем использование селектора jQuery или комбинации селекторов - см. http://jsperf.com/jquery-first-child-selection-performance/6. Обычно это не проблема - либо она используется в месте, где производительность не имеет большого значения, либо достаточно просто получить доступ к элементу DOM и использовать его свойство .firstChild. Однако есть пара проблем с этим:
- firstChild может вернуть текст или комментарий node, а не элемент, поскольку селектор jQuery вернет
- Если мне нужно выбрать первый дочерний элемент из нескольких элементов, я должен либо использовать медленный селектор, либо перейти к много дополнительной работе, итерации по элементам DOM, добавив их в коллекцию, а затем вернув их в объект jQuery.
Мне кажется, что стоимость добавления метода firstChild в базовую библиотеку jQuery будет намного меньше преимуществ. Я попытался создать такой метод для своего использования:
$.fn.firstChild = function() {
var ret = [];
this.each(function() {
var el = this.firstChild;
//the DOM firstChild property could return a text node or comment instead of an element
while (el && el.nodeType != 1)
el = el.nextSibling;
if (el) ret.push(el);
});
//maintain jQuery chaining and end() functionality
return this.pushStack(ret);
};
В тестах, которые я создал в http://jsperf.com/jquery-multiple-first-child-selection, эта функция выполняет более чем в пять раз быстрее, чем любая другая опция. Тесты основаны на тестах, упомянутых выше, но выбирают первые дети из нескольких элементов, а не один элемент.
Есть ли что-то, что мне не хватает? Техника, которую я должен использовать? Или это проблема, о которой не стоит беспокоиться? Есть ли причина не включать такую функцию в jQuery?