В чем разница между возвращением `$$` webkit и возвращением jQuery `$`?

Question

Если в браузере Webkit, как Chrome, я делаю:

$$('span');

Я получаю результат, который выглядит почти так же, как jQuery:

$('span');

---

Если в консоли я ищу определение $$ Я получил:

bound: function ()
{
    return document.querySelectorAll.apply(document, arguments)
}

И для $ Я получил:

function (a,b){return new c.fn.init(a,b)}

---

Какой тип функций я могу сделать на $$ объект, который я не могу сделать с помощью jQuery ($) объект?

Answer 1

Поскольку $$ это просто обертка для querySelectorAll Вы можете передать любые действительные селекторы.

"Какой тип функций я могу делать с объектом $$, который я на самом деле не могу сделать с объектом jQuery ($)?"

Первый, $$ не такой объект, как jQuery. Это объект, но это просто простой функциональный объект, который является оберткой (ярлыком) для document.querySelectorAll, Возвращает NodeList из элементов, которые он нашел.

Единственное, что он поддерживает, что Sizzle не поддерживает, насколько мне известно, это :nth-of-type,

(Конечно, Sizzle по умолчанию qsa когда вы даете действительный селектор, так что вы можете передать nth-of-type к функции jQuery в браузерах, которые также поддерживают qsa .)

В Sizzle есть несколько селекторов, которые не поддерживаются querySelectorAll так что вы можете технически сделать больше с jQuery/Sizzle.

К ним относятся:

• :eq()
• :gt()
• :lt()
• :first
• :last
• :not() (Когда вы даете ему несколько селекторов. Простой :not() значения поддерживаются в qsa .)
• :animated
• :input
• :button
• :checkbox
• :even
• :odd
• :has()
• :image
• :password
• :radio
• :reset
• :selected
• :submit
• :text
• :visible

... чтобы назвать несколько несколько.

---

Имейте в виду, что Sizzle сначала пытается использовать querySelectorAll, Если вы передали проприетарный селектор, то по умолчанию используется собственный движок Sizzle.

поскольку qsa обычно быстрее, чем Sizzle, может быть целесообразно рассмотреть альтернативы проприетарным селекторам, перечисленным выше, для повышения производительности.

---

Также обратите внимание, что Webkit не определяет $$ где угодно, кроме как в консоли. $$ ярлык недоступен в ваших сценариях, если вы не сделаете его доступным.

Answer 2

$$ как вы сказали, это специфичный для webkit и должен использоваться только в консоли. Он имеет очень похожие селекторы с jQuery, с той разницей, что он будет возвращать массив узлов DOM, тогда как jQuery будет возвращать массив jQuery

Эти два идентичны:

$$('span');

$('span').get();

Селекторы JQuery на самом деле немного более мощные, так как они добавляют селекторы, которые не существуют в DOM, как :checkbox, :contains, так далее.

Справка: Селекторы JQuery

Answer 3

WebKit определяет $$ а также $ по умолчанию в качестве кратких ссылок на document.querySelectorAll, Когда jQuery загружается, он заменяет значение $ с помощью функции jQuery. JQuery также сохраняет оригинал $ ценность, если вам это нужно. WebKit делает это, чтобы внедрить согласованный API для запросов к DOM, независимо от того, используете ли вы jQuery или нет.

Большая разница в том, что результат querySelectorAll это массив элементов DOM (NodeList - спасибо @lonesomeday), тогда как jQuery - это объект jQuery.

Answer 4

Просматривая страницу инструментов разработчика Chrome, можно увидеть, что инструменты разработчика Chrome поддерживают API командной строки Firebug (это означает, что Firebug поддерживает $$ также).

Документация для $$ состояния:

$$ (селектор)

Возвращает массив элементов, которые соответствуют данному селектору CSS.

Что примерно эквивалентно jQuery(selector), где selector является селектором CSS, и возвращаемые типы, очевидно, будут другими. Короче говоря, вы, вероятно, больше ничего не можете сделать конкретно с $$, но, глядя на API командной строки Firebug, похоже, что есть некоторые полезные функции (особенно если у вас нет jQuery, доступного на странице).

Answer 5

Вот мой бит. При исследовании я получил это из документов Safari. Отладка вашего веб-сайта.

Так говорит раздел API командной строки.

В дополнение к обычным методам JavaScript, а также функциям и переменным, определенным в вашем скрипте, вы можете интерактивно вводить некоторые API-интерфейсы командной строки Firebug на консоли. Следующие команды поддерживаются в интерактивном режиме:

$ 0- $ 4
Переменные, которые содержат текущий и предыдущие три выбранных узла в веб-инспекторе.

$ (ID)
Возвращает элемент с указанным идентификатором. Аналогично getElementById ().

$$ (селектор)
Возвращает массив элементов, которые соответствуют данному селектору CSS. Похоже на querySelectorAll.

$ Х (XPath)
Возвращает массив элементов, которые соответствуют заданному выражению XPath.

Answer 6

Как показывает ваш вопрос, $$ это обертка вокруг document.querySelectorAll, Это означает, что у него те же параметры, когда вы вызываете его, и он возвращает то же самое.

Отличия к $ (JQuery):

• $$ поддерживает селекторы CSS, поддерживаемые браузером. $ использования querySelectorAll когда это возможно, но он также поддерживает некоторые пользовательские расширения (например, :has). Они не будут доступны с $$,
• $$ возвращает статический NodeList, Это не особенно полезное существо. Он ведет себя немного как массив (он имеет length собственности, и вы можете получить доступ к его членам с [0] и т.д.), но ни один из обычных методов массива не будет доступен. jQuery написан для предоставления объекта, чтобы обернуть найденные элементы, и есть много удобных методов. Ни один из них не будет существовать в результате $$,
• $$ будет самый быстрый вариант, почти всегда. $ почти всегда будет медленнее, и часто будет намного медленнее.

Обратите внимание, что консоль Chrome покажет результат $ и результат $$ как будто они были массивами. Ни один не является; они просто отображаются как массивы, потому что это простой способ их концептуализации. $$ возвращает NodeList, $ пользовательский объект.