Компонент CssSelector

Дата обновления перевода 2021-12-26

Компонент CssSelector

Компонент CssSelector преобразует селекторы CSS в выражения XPath.

Установка

1
$ composer require symfony/css-selector

Note

Если вы устанавливаете этот компонент вне приложения Symfony, вам нужно подключить файл vendor/autoload.php в вашем коде для включения механизма автозагрузки классов, предоставляемых Composer. Детальнее читайте в этой статье.

Применение

See also

Эта статья объясняет как использовать функции CssSelector как независимого компонента в любом приложении PHP. Прочитайте статью Функциональные тесты Symfony для понимания как использовать его при создании тестов Symfony.

Зачем использовать селекторы CSS?

Когда вы анализируете HTML или XML документ, наиболее мощным методом для этого является XPath.

Выражения XPath невероятно гибкие, так что почти всегда существует выражение XPath, которое найдёт нужный вам элемент. К сожалению, они также могут стать очень сложными, и обучение им непростое. Даже общие операци (например, поиск элемента с определённым классом), может требовать длинных и неупорядоченных выражений.

Многие разработчики -- особенно веб-разработчики -- больше всего любят использовать селекторы CSS для поиска элементов. Так же, как и работа с таблицами стилей, селекторы CSS используются в JavaScript с функцией querySelectorAll() и в популярных JavaScript библиотеках, вроде jQuery.

CSS селекторы менее мощные, чем XPath, но намного проще в написании, прочтении и понимании. Так как оии менее мощные, почи все селекторы CSS могут быть преобразованы в эквивилент XPath. Это выражение XPath может быть использовано с другими функциями и классами, использующими XPath, чтобы найти элементы в документе.

Компонент CssSelector

Единственная цель компонента - преобразовывать селекторы CSS в их эквиваленты XPath, используя toXPath():

1
2
3
4
use Symfony\Component\CssSelector\CssSelectorConverter;

$converter = new CssSelectorConverter();
var_dump($converter->toXPath('div.item > h4 > a'));

Это даёт следующий вывод:

1
descendant-or-self::div[@class and contains(concat(' ',normalize-space(@class), ' '), ' item ')]/h4/a

Вы можете использовать это выражение с, к примеру, DOMXPath или SimpleXMLElement, чтобы найти элементы в документе.

Tip

Метод Crawler::filter() использует компонент CssSelector, чтобы найти элеметы, основанные на строке CSS селектора. См. Компонент DomCrawler, чтобы узнать больше.

Ограничения компонента CssSelector

Не все CSS селекторы могут быть преобразованы в эквиваленты XPath.

Вот некоторые CSS селекторы, которые имеют смысл только в контексте веб-браузера.

  • селекторы состояния ссылки: :link, :visited, :target
  • селекторы, основанные на действии пользователя: :hover, :focus, :active
  • селекторы состояния UI: :invalid, :indeterminate (однако, :enabled, :disabled, :checked и :unchecked доступны)

Псевдо-элементы (:before, :after, :first-line, :first-letter) не поддерживаются, так как они выбирают части текста, а не элементы.

Некоторые псевдо-классы поддерживаются частично:

  • Не поддерживаются: *:first-of-type, *:last-of-type, *:nth-of-type и *:nth-last-of-type (все они работают с именем элемента (например, li:first-of-type), но не с селектором *).
  • Поддерживается: *:only-of-type.

Узнайте больше