Компонент CssSelector

Дата оновлення перекладу 2022-10-27

Компонент CssSelector

Компонент CssSelector перетворює селектори CSS у вираз XPath.

Установка

1
$ composer require symfony/css-selector

Note

Якщо ви встановлюєте цей компонент поза додатком Symfony, вам потрібно підключити файл vendor/autoload.phpу вашому коді для включення механізму автозавантаження класів, наданих Composer. Детальніше можна прочитати у цій статті.

Застосування

See also

Ця стаття пояснює як використовувати функції CssSelector як незалежного компонента в будь-якому додатку PHP. Прочитайте статтю Функціональні тести Symfony для розуміння, як використовувати його при створенні тестів Symfony.

Коли ви аналізуєте 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.