Выбор класса CSS с помощью XPath в PHP: решение

Пройдите тест, узнайте какой профессии подходите

Я предпочитаю
0%
Работать самостоятельно и не зависеть от других
Работать в команде и рассчитывать на помощь коллег
Организовывать и контролировать процесс работы

Быстрый ответ

Если вам необходимо найти элементы с определённым CSS-классом с использованием XPath, можно воспользоваться функцией contains() следующим образом:

xpath
Скопировать код
//*[contains(concat(" ", normalize-space(@class), " "), " целевой-класс ")]

А для выбора элементов div, которые имеют класс myClass, используйте:

xpath
Скопировать код
//div[contains(concat(" ", normalize-space(@class), " "), " myClass ")]
Кинга Идем в IT: пошаговый план для смены профессии

Точный выбор

Для выбора элементов с определённым классом в XPath используется селектор, получаемый путём сочетания функций contains(), concat() и normalize-space().

Идеальный XPath для поиска без учета регистра

В случае, если вам необходимо осуществить поиск классов без учёта регистра, можно прибегнуть к функции translate():

xpath
Скопировать код
//*[contains(translate(@class, 'ABCDEFGHIJKLMNOPQRSTUVWXYZ', 'abcdefghijklmnopqrstuvwxyz'), 'целевой-класс')]

Справляемся со сложностью многочисленных классов

Если у элемента установлено несколько классов, требуется использовать специальные методы. Селектор [@class='date'] в этом случае будет недостаточно эффективен, поэтому предпочтительнее использовать возможности XPath 2.0 и 3.1.

Для XPath 2.0:

xpath
Скопировать код
//*[count(index-of(tokenize(@class, '\s+'), 'date')) > 0]

Для XPath 3.1 удобно применять contains-token:

xpath
Скопировать код
//*[contains-token(@class, 'date')]

Важные моменты

Точный выбор классов

Когда у элемента один класс, подход может быть точным:

xpath
Скопировать код
//img[@class='date']

Но заметьте, что с несколькими классами этот метод становится нерезультативным.

Выбор классов по полному совпадению

Когда необходимо найти элементы, класс которых полностью совпадает с указанным:

xpath
Скопировать код
//*[contains(concat(" ", normalize-space(@class), " "), " date ")]

Визуализация

Попробуем визуализировать поиск CSS-класса с помощью XPath:

Представьте себе, что вы — детектив, выслеживающий каждого везунчика с синим билетом:

В XPath это будет выглядеть так:

xpath
Скопировать код
//person[@class='blue-ticket']

Вашей задачей будет отыскать каждого человека (<person>), обладающего синим билетом (.blue-ticket).

Возможные сложности и их решения

Остерегайтесь ложных совпадений

Будьте внимательны с классами, которые частично совпадают с "date", например "deadline" или "update". Использование конкатенации поможет достигнуть точности в выборке.

Внимание при динамическом изменении классов

Если классы элемента могут динамически меняться, ваш запрос может устареть. Важно быть готовым к возможным изменениям.

Приятных веб-путешествий

Точной выбор классов сделает процесс веб-скрэпинга и автоматического тестирования значительно проще.

Полезные материалы

  1. Xpath в Selenium: методы и примеры — Учебник по XPath для WebDriver Selenium.
  2. CSS-селекторы | MDN — Основы CSS-селекторов.
  3. Учебник по XPath в W3Schools — Ваш курс на освоение XPath.
  4. Селекторы CSS-Tricks — Секреты эффективного использования CSS-селекторов.
  5. ScrapingBee: веб-скрэпинг API — Применение XPath для скрэпинга HTML с примерами из реальной жизни.
  6. Новые вопросы по 'xpath' на Stack Overflow — Следите и участвуйте в обсуждении темы XPath.