Что является источником функции запроса селектора двойного знака доллара в Chrome / Firefox? - PullRequest
Новая
       61

Что является источником функции запроса селектора двойного знака доллара в Chrome / Firefox?

60 голосов
/ 24 января 2012

Проверьте это jsfiddle и посмотрите на консоль.$$ не определено.Теперь откройте совершенно новое окно и введите $$ в консоли.Он определяет функцию для получения (jquery-подобного) массива всех элементов dom, которые соответствуют селектору:

> $$

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

Это добавляется инструментами Dev?Он также присутствует при использовании Firebug в Firefox.Используется ли он внутри самими инструментами?

Ответы [ 2 ]

189 голосов
/ 25 апреля 2012

Во-первых, все в ответе ziesemer верен.

Это все о истории JavaScript

Существует множество функций, доступных в различных консолях devtools браузера.В совокупности методы известны как API командной строки (автономный режим) ( новая ссылка ), и все они происходят из Firebug.В настоящее время у нас просто есть паритет между браузерами, потому что Firebug сделал все (в основном) правильно.

Но когда создавался Firebug (2006), библиотекой JavaScript, которая была в моде, был Prototype.js.$ был захвачен Прототипом для некоторого getElementById() синтаксического сахара, поскольку это, безусловно, был самый быстрый способ получить элементы и самый распространенный метод получения элементов в то время.Это была такая экономия времени, люди использовали всю библиотеку только для $ сахар .

В начале 2006 года дебютировал jQuery и использовал $() для выбора любого элемента на основе селектора css.Как показывает мой старый пост о временной шкале CSS Selector Engine *, Prototype за этим последовал через четыре дня со своими собственными, но поскольку $ уже был взят в их библиотеке, они просто пошли к $$(), которая теперь известна как функция bling-bling .

Таким образом, Firebug использовал API-интерфейс Prototype, так как он все еще управлял насадкой в ​​2006 году. Теперь, во времена jQuery и post-jQuery-алиасингов, таких как window.$ = document.querySelectorAll.bind(document), мы видим его как довольно задом наперед.Интересно, что когда Opera произвела революцию в Dragonfly, своих инструментах для разработки браузеров, они выбрали $ в качестве псевдонима querySelectorAll, чтобы лучше соответствовать современным практикам, что в IMO имеет больше смысла.

О, вы имели в виду источник code ..

Теперь вы спросили об "источнике" $$ в DevTools, и я объяснил историю.Упс!Что касается того, почему он доступен в вашей консоли ... все методы API командной строки (офлайн) ( новая ссылка ) доступны только в контексте вашей консоли, простокак удобные методы.

copy() - один из моих любимых;Я и другие расскажу об этом Консоли JavaScript для опытных пользователей видео.

32 голосов
/ 24 января 2012

Ну, Firebug Lite определяет это как: 

this.$$=function(selector,doc){if(doc||!FBL.Firebug.chrome){return FBL.Firebug.Selector(selector,doc)

( См. Источник .)

Полная версия Firebug определяет это как 

this.$$ = function(selector)
{
    return FBL.getElementsBySelector(baseWindow.document, selector);
};

Это на самом деле задокументировано и да, оно также используется внутри.

Так что я предполагаю, что Google Chromeделать что-то подобное.

...