Разница между селектором CSS и фильтром jQuery?

можно передать селекторы CSS в функцию jQuery, такую как:

jQuery('h1 + h2');

библиотека jQuery также имеет некоторые фильтры, такие как :even и :odd:

jQuery('tr:even');

я искал какое-то синтаксическое правило, которое различает два, и я думал, что, возможно, фильтры jQuery всегда используют :.

однако, некоторые селекторы CSS использовать :. Для пример:

  • :last-child
  • :root
  • :empty
  • :target

есть ли у кого-нибудь умные советы, чтобы узнать, используется ли это селектор CSS или фильтр jQuery?

3 ответов


я искал какое-то синтаксическое правило, которое различает эти два, и я думал, что, возможно, фильтры jQuery всегда используют :.

однако, некоторые селекторы CSS также использовать :.

есть ли у кого-нибудь умные советы, чтобы узнать, используется ли это селектор CSS или фильтр jQuery?

это одна из самых раздражающих вещей о библиотеках селекторов, использующих синтаксис CSS в своих собственных расширениях: потому что оба фильтра на основе соответствия и истинные псевдоклассы объединены в общий термин, известный как " псевдо-селекторы "(что в основном означает " селекторы, которые начинаются с :"), единственный способ узнать, является ли "псевдо-селектор" фильтром или истинный простой селектор-это знать, что он делает, что, если вы не знакомы с селектором, часто означает ссылку на документация jQuery как упоминалось другими здесь. Вы заметите, что большинство этих фильтров на основе совпадений будут иметь слово "совпадение" где-то в своих описаниях; это разумный показатель того, что "псевдо-селектор" работает как фильтр на основе совпадений.

в jQuery есть подкатегория селекторов под названием Основные Фильтры, однако имя полностью вводит в заблуждение, и сами селекторы плохо классифицированы; не все из них являются фактическими фильтрами, но некоторые из них функционируют как стандартные псевдоклассы! По крайней мере the расширения jQuery категория имеет собственное имя-потому что эти селекторы нестандартны.

то, что я называю "фильтром на основе соответствия", в основном является селектором, который соответствует элементу на основе весь комплекс селектора на селектор. Звучит запутанно? Потому что так оно и есть.

на самом деле, для удобства, вот список селекторов jQuery, которые работают как совпадающие фильтры:

эти селекторы возвращает N-й элемент(ы) из набора игр, в отличие от других, стандартных селекторов, которые принимают каждый элемент и делайте выводы из того, что он основан исключительно на информации об элементе, предоставленной DOM или иным образом, а не на остальной части строки селектора. Хотя их очень часто сравнивают с :first-child, :last-child, :nth-child() и :nth-last-child(), они значительно отличаются по функциональности. Будьте очень осторожны в выборе того, какой селектор использовать.

например, следующий селектор, используя jQuery :first:

$('ul > li:first')

матчи только один element: первый элемент, соответствующий селектору ul > li, независимо от того, сколько ul и li элементы есть в DOM. Эта нотация селектора может быть записана как вызов метода, например:

$('ul > li').first()

что делает его гораздо яснее, чем на самом деле. Он отличается от :first-child:

$('ul > li:first-child')

в этой :first-child выбирает каждый li это первый ребенок своего родителя ul, и, следовательно, может потенциально вернуть один или li элементы, в отличие от ровно одного с :first.

также стоит упомянуть :not() селектор; хотя я не считаю его таким же фильтром, как и вышеупомянутые селекторы, важно помнить, что jQuery расширяет его от того, что на самом деле предлагается в CSS. Различия подробно описаны в этот вопрос. Я предполагаю, что он классифицируется по основным фильтрам в любом случае из-за .not(), который безусловно, для всех намерений и целей метод фильтра, и антитеза .filter().


идея функции утилиты jQuery selector состоит в том, чтобы принять любой селектор css (включая селекторы css3) и в дополнение к этому добавить несколько дополнительных, которые не определены в спецификации css (примеры которых :odd (который в действительном css :nth-child(odd)) и :not(селектор), например). Настоятельно рекомендуется не не использовать селекторы jQuery, за исключением случаев, когда это действительно необходимо, поскольку собственные селекторы css могут быть обработаны (в современных веб-браузерах) намного быстрее чем пользовательский jQuery css. Как уже упоминалось в gdoron, вы можете увидеть полный список в документация jquery если вам нужно проверить, доступен ли конкретный селектор, и вы также можете найти пользовательские селекторы.


Да, этот селектор существует в jQuery
Селектор называется следующий смежный селектор

вы можете увидеть полный список селекторов здесь

есть ли у кого-нибудь умные советы, чтобы узнать, используется ли это селектор CSS или фильтр JQuery?

мой совет, проверьте API, если селектор существует или нет...