Селекторы CSS сопоставляются движками браузера справа налево. Поэтому они сначала находят детей, а затем проверяют своих родителей, чтобы убедиться, что они соответствуют остальным частям правила.
- Почему это?
- Это только потому, что в спецификации сказано?
- Влияет ли это на возможный макет, если он был оценен слева направо?
Для меня самый простой способ сделать это - использовать селекторы с наименьшим количеством элементов. Сначала идентификаторы (так как они должны возвращать только 1 элемент). Тогда, возможно, классы или элемент, который имеет наименьшее количество узлов - например, на странице может быть только один промежуток, поэтому перейдите непосредственно к этому узлу с любым правилом, которое ссылается на промежуток.
Вот несколько ссылок, подтверждающих мои претензии
- http://code.google.com/speed/page-speed/docs/rendering.html
- https://developer.mozilla.org/en/Writing_Efficient_CSS
Похоже, что это сделано таким образом, чтобы не смотреть на всех детей родителя (которых может быть много), а не на всех родителей ребенка, который должен быть одним. Даже если DOM является глубоким, он будет рассматривать только один узел на уровень, а не несколько при сопоставлении RTL. Проще / быстрее оценить CSS селекторы LTR или RTL?
#foo
селектор должен соответствовать всем этим узлам. У jQuery есть возможность сказать, что $ ("# foo") всегда будет возвращать только один элемент, потому что они определяют свой собственный API со своими правилами. Но браузеры должны реализовать CSS, и CSS говорит, что все в документе должно соответствовать заданному идентификатору.
querySelectorAll
). В других случаях используется Sizzle. Sizzle не соответствует нескольким идентификаторам, но QSA соответствует (AYK). Выбор пути зависит от селектора, контекста, браузера и его версии. API запросов jQuery использует то, что я назвал «Native First, Dual Approach». Я написал статью об этом, но она не работает. Хотя вы можете найти здесь : avenbelow.ca/hosted/dhtmlkitchen/JavaScript-Query-Engines.html