2012-01-26 3 views
4

При использовании селекторов в CSS и в jQuery существуют ли различия в эффективности между использованием 'E#id' и #id, где E - любой элемент HTML? Если да, применяется ли это только к некоторым механизмам компоновки и/или механизмам JavaScript?Selector Performance - 'E # id' vs '#id' - в CSS и jQuery

+0

Некоторые из новых (и я имею в виду новых) новых браузеров имеют инспекторы производительности CSS, которые позволяют вам проверять себя. – icktoofay

+1

По-моему, единственная причина использования '' E # id'' заключается в том, что вы хотите только выбрать элемент с этим идентификатором _if_, это правильный тип, хотя я не могу действительно думать о многих примерах реального мира, где есть не будет лучшим способом сделать это в любом случае. (Помните, что идентификатор должен быть уникальным, поэтому его нельзя использовать для различения разных элементов на одной странице.) – nnnnnn

+0

«id» должен появляться только один раз в документе, поэтому вам не нужно будет использовать имя элемента в этом селекторе. –

ответ

3

Браузеры читают селектор справа налево, поэтому мало что можно получить, префикс чего-либо перед идентификатором; он избыточен в этой точке. Источник: Writing Efficient CSS от Mozilla

Это real world example, чтобы проверить это сами. TL: DR; это, кажется, не имеет большого значения, чтобы иметь значение.

Соответствующее дальнейшее чтение из предыдущей Stack Overflow question

+2

На самом деле, 'E # id' имеет более высокую специфичность, чем' # id'. [Demo] (http://jsfiddle.net/x7Ahx/) – bookcasey

+1

@bookcasey Это не относится к вопросу. OP интересуется только различиями в скорости между двумя селекторами в отношении javascript и механизмов выбора. –

+0

Это не имеет никакого отношения к праву налево. – BoltClock

0

1) Считается, что использование идентификаторов для CSS не является хорошей практикой. Он должен использоваться при манипулировании контентом через javascript.

2) Над квалификационным селектором CSS с именем тега ul.top-nav или ul # top-nav будет только увеличивать накладные расходы на браузере, поскольку он должен соответствовать как тегу & class/ID. Следовательно, избегайте чрезмерной квалификации селектора.