Какова цель ведущего двоеточия в селекторе jQuery?

Question

Я начало использования инструментария Wijmo, и наткнулся на довольно много примеров селекторов, подобных этим в своих страницах документации:

$(":input[type='radio']").wijradio(); 

Я бы написал мой так:

$('input[type=radio]').wijradio(); 

Они делают то же самое или есть что-то, что мне не хватает?

Обратите внимание, что существуют два отличия: первый селектор имеет префикс двоеточия и имеет кавычки для типа ввода.

Answer 1

:input является jQuery extension, а input - это селектор CSS.

textarea, button и select элементы будут соответствовать первому, но не последнему.

Последнее быстрее, поэтому используйте его для вашего конкретного примера radio. Используйте :input, если хотите «все элементы формы», даже если они не являются строго <input> тегами. Даже в этом случае рекомендуется использовать стандартный селектор CSS, затем используйте .filter(':input') на этом наборе.

Потому что: вход является расширением JQuery и не является частью спецификации CSS , запросы с использованием: вход не может воспользоваться повышением производительности предоставляемых нативным методом DOM querySelectorAll() . Для достижения наилучшей производительности при использовании: input для выбора элементов , сначала выберите элементы, используя чистый CSS-селектор, затем используйте .filter (": input").

В 1.7.2 источника,: входной фильтр проверяет регулярное выражение против NodeName:

input: function(elem) { 
      return (/input|select|textarea|button/i).test(elem.nodeName); 
}, 

Answer 2

Селектор :input в основном выбирает все элементы управления form (вход, текстовое поле, выбери и кнопку элементы), где в качестве input селектора выбирает все элементы от имени тега input.

Поскольку радиокнопка представляет собой элемент form, а также использует тег input, чтобы оба они могли использоваться для выбора переключателя. Однако оба подхода отличаются тем, как они находят элементы, и, следовательно, каждый из них имеет разные преимущества в производительности.

Answer 3

селектор $("input") будет выбирать только элементы ввода типа

в то время как $(":input") селектор будет захватывать все элементы входов (например, текстовое поле, выбор, ввод и т. д.)

для получения дополнительной информации, зайдите в официальную документацию jQuery о :input селекторные:

http://api.jquery.com/input-selector/