Как получить xpath ссылки

Selenium Python XPath Guide

При работе с Selenium , если известные локаторы не находят элемент в веб-страница с использованием значений атрибутов дерева DOM, таких как id , class и name , затем с использованием CSS или XPath селекторы (XML-путь), чтобы найти его.

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

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

Что касается примеров, я буду использовать следующий скрипт, который ищет элементы на странице поиска Яндекса:

Переменной target_page присваивается строковое значение, содержащее адрес страницы, на которой мы будем искать элементы. Критерии поиска задаются с помощью выражения XPath, которое также присваивается в виде строки переменной xpath_testing.

Краткое введение в XML и XPath

Некоторые разработчики ошибочно полагают, что HTML — это подмножество XML, но на самом деле это не так, код на обоих языках не может быть объединен в одном документе. Таким образом, язык XML предназначен для хранения и передачи структурированных данных. HTML в свою очередь предназначен для его более или менее удобочитаемого отображения. Наиболее существенное различие между HTML и XML заключается в том, что HTML имеет предопределенные элементы и атрибуты, поведение которых предопределено и ожидаемо, а XML — нет. Кроме того, есть некоторые различия в синтаксисе инструкций на этих внешне похожих языках.

Однако у двух языков есть базовое сходство, которое в нашем случае мы можем эффективно использовать для поиска путей к требуемым элементам. на странице.

1. Документы HTML и XML состоят из элементов, каждый из которых содержит «начальный тег» ( ), «конечный тег» ( ) и информацию, заключенную между эти два тега (содержимое элемента).
2. Элементы могут быть аннотированы атрибутами, содержащими метаданные об элементе и его содержимом.
3. Любой документ представляет собой дерево, состоящее из узлов (элементов). Некоторые типы узлов могут содержать другие узлы.
4. Существует один корневой узел, который в конечном счете включает в себя все остальные узлы.

Xml использует специальный язык XPath для выбора узлов и наборов узлов из дерева документа и их дальнейшей обработки. XPath — это сокращение от XML, языка, используемого для идентификации определенных частей XML-документов (элементов страницы). Применительно к html-страницам XPath позволяет писать выражения, позволяющие получить, например, ссылку на первый элемент li в неупорядоченном списке ul, седьмой дочерний элемент третьего элемента div, ссылку, содержащую строку «Магазин с действием» и т.д. XPath позволяет получить ссылки на элементы в соответствии с их положением на странице (дереве документа), положением относительно другого элемента, меткой, текстовым содержимым и другими критериями.

Согласно методологии XPath существует пять типов узлов, которые можно найти в дерево документа обычной html-страницы:

1. Корневой узел;
2. Узлы элементов;
3. Текстовые узлы;
4. Узлы атрибутов;
5. Узлы комментариев.

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

Поиск путей

Хотя Выражения XPath в Xml также могут возвращать числа, логические значения и строковые выражения, то есть они могут обрабатывать элементы и их содержимое. Selenium использует только подмножество выражений XPath, называемых путями поиска . Пути поиска указывают на конкретный узел или набор узлов документа (элементов страницы), которые соответствуют заданным критериям поиска. Каждый путь поиска использует как минимум один шаг для идентификации узла документа или набора узлов. Этот набор может быть пустым, содержать один или несколько узлов. Узел может быть корневым узлом, определенным элементом, атрибутом, текстом или узлом комментария.

Абсолютные пути

Самый простой путь поиска — тот, который указывает на документ (страница ) корневой узел. Этот путь обозначается простой косой чертой / и всегда представляет то же самое: корневой узел документа. Каждый документ имеет только один корневой узел, который является общим корнем дерева узлов. Корневой узел не имеет родительских узлов. Значением корневого узла является значение элемента документа.

Косая черта / всегда начинается с абсолютного пути к элементу (пути поиска). Получить его можно с помощью специальных расширений для браузера или как в Chrome. Откройте окно Chrome DevTools, щелкните правой кнопкой мыши нужный элемент, откройте контекстное меню, выберите Копировать , а затем Копировать весь XPath .

Абсолютный путь — это полный и уникальный путь к элементу, начинающийся с корневого узла. Маршрут, полученный предыдущим способом, будет выглядеть так:

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

Абсолютный путь, аналогичный абсолютному пути к любому файлу в файловой системе операционной системы, всегда однозначно указывает на нужный элемент. Однако у него есть один существенный недостаток: если внешний вид страницы изменится, она, скорее всего, перестанет работать. Это особенно верно, если на странице используется множество различных интерактивных функций JavaScript или анимации элементов.

Обратите внимание, что корневой элемент страницы имеет абсолютный путь (путь) /html, и если мы укажем только ‘/’ как выражение XPath, исключение типа InvalidSelectorException будет выдано вместе с сообщением «Селектор недействителен. Результат поиска XPath не вернул объект элемента. Элемент не найден.»

Вывод. Символ / объединяет различные шаги в составном пути поиска. Каждый шаг в пути относится к предыдущему. Если путь начинается с / , тогда путь является абсолютным, и его первый переход относится к корневому узлу.

Относительные пути

Относительный путь начинается с двух косых черт, за которыми следует одна метка для нужного нам элемента. элементы в любой части веб-страницы, избегая необходимости вводить весь абсолютный XPath, и вы можете запустить его в середине структуры документа (DOM) страницы.Позволяет выбрать все элементы указанного тега на страницы, соответствующие заданным критериям поиска. Например, выражение XPath //li относится ко всем элементам li на странице (в DOM-дереве) , поэтому путь к логотипу Яндекса на странице поиска будет выглядеть так:

Пусть вас не смущают выражения в скобках, они называются предикатами и служат для сужения диапазона поиска элементов, то есть для уточнения нашего пути поиска. резаки и их использование будут обсуждаться далее в этом руководстве. Между тем, обратите внимание, что выражение в круглых скобках говорит нам, что искомый div должен иметь атрибут роли со значением img .

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

Это выражение XPath позволяет получить ссылки на список сообщений, опубликованных на главной странице поисковой системы Яндекс. Обратите внимание, что этот путь намного короче, чем путь, использующий абсолютный путь, и его логика также понятнее. Также обратите внимание, что значение атрибута класса ol элемента отсортированного списка представляет собой строковое значение, состоящее из двух соответствующих имен классов CSS. Если указать в выражении имя только одного из них, например //ol[@class = ‘message__list’] , то получится пустой набор элементов.

Теперь попробуем переписать приведенное выше такое выражение:

И мы получаем точно такой же результат, как и предыдущее выражение. По сути, мы заменили все элементы пути промежуточной ссылки двумя косыми чертами // и упростили их внешний вид. Таким образом, вы можете удалить любое количество промежуточных шагов (элементов) из пути к искомому элементу.

Вывод. В начале выражения XPath символы // по существу выбирают всех потомков корневого узла с указанным тегом. Например, выражение XPath //div выбирает все элементы div в документе. Если мы используем символ // в пути для разделения отдельных шагов, мы можем пропустить промежуточные шаги и, таким образом, сократить запись пути. Относительный Xpath всегда предпочтительнее, поскольку он более логичен и удобочитаем, а также устойчив к динамическим изменениям древовидной структуры страницы DOM механизмом Javascript.

Подстановочные знаки

Выражения подстановочных знаков позволяют выбирать несколько типов элементов одновременно. Вы можете использовать два типа подстановочных знаков при разборе страниц: * , @ * .

Звездочка * или звездочка соответствует любому узлу элемента независимо от его типа. Звездочка * является одним из наиболее часто используемых подстановочных знаков в выражениях XPath в Selenium.

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

Приведем несколько примеров его использования.

• //*: соответствует всем элементам страницы (включая тег html).
• //div/* — сравнивает все элементы, которые являются непосредственными дочерними элементами элемента с тегом div.
• //input[@*] — Соответствует всем элементам с тегом input, которые имеют хотя бы один произвольный атрибут, где значение атрибута может быть любым, присутствовать или отсутствовать.
• //*[@*] — Соответствует всем элементам на странице, имеющим хотя бы один атрибут.

Предикаты

Как мы уже знаем, в общем случае выражение XPath может ссылаться более чем на один узел (элемент страницы), т. е. метод, в котором use возвращает массив элементов. Иногда это именно то, что нам нужно, но в некоторых случаях приходится «просеивать» его по определенным критериям, чтобы выбрать лишь несколько. Для этих целей XPath использует синтаксис предиката . Каждый шаг в пути поиска может иметь свой предикат или даже несколько, задающих свои критерии выбора из текущего списка узлов на каждом шаге пути поиска. . Это означает, что на каждом шаге поиска может быть один или несколько предикатов. Предикат в основном содержит логическое выражение, которое проверяется для каждого узла в наборе элементов страницы, извлеченных из указанного пути. Если выражение ложно, этот узел удаляется из множества; в противном случае он сохраняется соответствующим образом.

Предикат

— это часть выражения XPath, заключенная в квадратные скобки, которая следует за критериями выбора узла (элемента) в операторе пошагового поиска. В общем виде выражение с предикатом будет выглядеть так:

Предположим, вы хотите найти кнопку для отправки поискового запроса на главной странице Яндекса. Выражение XPath, допускающее это, будет выглядеть так:

В начале, на первом шаге, мы выбираем все элементы div, для которых истинно следующее логическое значение предиката: значение атрибута класса соответствует значению строки search2__button . На втором шаге выбираем из них элементы с тегом кнопки, являющиеся их непосредственными потомками, значение атрибута роли которых содержит кнопку со строковым значением.

В следующем примере выбираем ссылку на Яндекс Маркетная корзина, которая также находится на главной странице поисковых систем. Использование нескольких атрибутов в выражении XPath сокращает поиск элементов

Вывод. Механизм предикатов очень полезен для сужения диапазона необязательных элементов на странице в соответствии с заданными критериями, основанными на логических выражениях. С помощью предикатов мы можем задать искомым элементам произвольные специфические идентификаторы.

Определить положение элемента с помощью индексов

С помощью синтаксиса индекса можно выбрать нужные элементы из набора, при этом его номер указан в квадратные скобки по аналогии с синтаксисом полей. В следующем примере мы получаем третий элемент из списка сообщений на странице Яндекса.

Второе выражение XPath позволяет получить элемент с тегом range из выбранного элемента списка, содержащего новости контента текст заголовка. Обратите внимание, что индексы элементов начинаются с 1 , а не с 0 , как это обычно бывает при индексировании массивов в Python.

Использование логических операторов OR и AND в выражениях XPath

Логические операторы используются в предикаты команд для объединения критериев поиска для поиска нужных элементов на странице.

В следующем примере показаны выражения для фильтрации ссылок на сообщения, отображаемые на странице поиска Яндекса.

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

Использование функций XPath

Функция Text()

Функция XPath text() — это функция, встроенная в синтаксис Selenium XPath, используемая для поиска элементов на основе строкового значения, содержащегося в их текстовом узле. Это означает, что если элемент имеет текстовое содержимое в виде строки, элемент можно найти следующим образом:

Функция contains()

Функция contains() часто используется в XPath. выражение определяет, когда значение атрибута элемента или текстовое содержимое могут динамически изменяться.

Например, класс class3 можно добавить к значению атрибута класса //element[ @class=’class1 class2′] с помощью Javascript. анимировать его, а затем анимировать его, а также удалять динамически. В этом случае значение предиката становится ложным при добавлении нового класса, то есть элемент не будет выбран. В этом случае мы можем использовать функцию contains() следующим образом:

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

Метод contains() позволяет вам найти элемент, используя текстовую подстроку значения атрибута или его текстовое содержимое, как показано в приведенном ниже примере XPath.

В этом примере мы находим элемент ссылка на корзину Яндекс Маркета из примера выше для значения атрибута title. Как и в случае с текстовым содержимым, здесь находится кнопка для отправки запроса в поисковую систему.

функция начинает ()

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

функция last()

Эта функция позволяет выбрать последний элемент (указанного типа) из набора элементов. Пример его использования показан ниже.

Это выражение возвращает элемент, содержащий название последней новости из списка новостей на странице поисковой системы Яндекса.

В следующем примере показано, как чтобы получить предпоследнюю новость.

Функция position()

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

Использование путей поиска целых элементов

До этого момента мы обсуждали, что в терминологии XPath называется путями быстрого поиска. Эти пути значительно проще написать, они менее многословны и знакомы большинству разработчиков. Кроме того, это именно те выражения XPath, которые лучше всего соответствуют простейшим шаблонам поиска. Однако XPath также предлагает полный синтаксис для путей поиска, который является более подробным, но, возможно, менее запутанным и, безусловно, более гибким.

Таким образом, каждый шаг в полном пути поиска имеет два обязательных части: так называемая ось и узел критерия (метка элемента), а также необязательная часть — предикаты. Ось указывает направление движения от контекстного узла к другим узлам. Критерии узлов определяют, какие узлы будут выбраны на текущем шаге поиска по этой оси . Они разделяются по всему пути двоеточием :: .

В основном, в пути быстрого поиска ось узла и критерий объединяются вместе. Например, следующий путь быстрого поиска имеет три шага.

На первом шаге выбираются на странице элементы упорядоченных списков ol по оси дочерних узлов, на втором — элементы li по оси дочерних узлов, третий шаг — также выбирает элементы ссылки по оси дочерних узлов и из них с помощью предиката выбирает только те, которые содержат атрибут rel=’noopener’ с заданным значением. Если мы перепишем это выражение в его полной форме, тот же путь поиска будет выглядеть следующим образом:

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

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

Этот сокращенный синтаксис выбора позволяет вам перемещаться непосредственно вдоль оси дочерних узлов, оси атрибута(ов) и ось всех его дочерних элементов, включая узел контекста (дочерний или самостоятельный). Полный синтаксис добавляет восемь дополнительных осей, которые полезны для использования в выражениях XPath и для поиска элементов на страницах с Selenium:

Ancestral Axis

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

В этом примере мы получаем ссылку на Яндекс Маркет, используя текстовое содержимое элемента div в Это. А следующее выражение позволяет выбрать последовательность всех предков этого элемента до корня документа /html .

Sibling Tracking Axis

Все последующие узлы элемента страницы до узла контекста и которые содержатся в одном узле элемента

В приведенном выше примере выражение выбирает блок div на основе содержимого атрибута класса, содержащего элементы входной строки слова, в том же порядке, что и элементы появляются в документе.

Дочерняя ось

Ось содержит все дочерние узлы текущего узла контекста, т. е. выбирает все элементы, содержащиеся в текущем узле. В следующем примере будут выбраны все элементы внутри блока div, содержащего логотип Яндекса.

Ось отслеживания

Все узлы, следующие за узлом контекста, в том же порядке, что и узлы в документе. Отличие поиска по этой оси от следующего родственного заключается в том, что будут выбраны все узлы (элементы), расположенные в документе после закрывающего тега узла контекста. Итак, в аналогичном примере ниже будут выбраны все элементы div, следующие за тегом логотипа Яндекса в документе. Сравните результаты поиска с предыдущим примером.

Предыдущая одноуровневая ось узлов (Предыдущая одноуровневая ось)

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

В данном примере выражение позволяет выделить скрытые поля в блоке с основной поисковой строкой Яндекса.

Ось предыдущих узлов (предыдущая ось)

Все узлы, которые предшествуют началу контекстного узла, в обратном порядке документа. Разница между поиском по этой оси и поиском по элементу , родственному , заключается в том, что будут выбраны все узлы (элементы) в документе до начального тега узла контекста. Итак, в аналогичном примере ниже будут выбраны все элементы div, которые следуют в документе перед тегом логотипа Яндекса. Сравните результаты поиска с предыдущими примерами.

По нисходящей оси

Поиск по нисходящей оси По убыванию выберет всех детей, а также их Детей, Внуков». В следующем примере мы выберем все элементы в блоке со строкой поиска на главной странице Яндекса.

Нисходящая ось, включая узел контекста (дочерняя или пользовательская ось)

Работает как по убыванию ось по убыванию , за исключением того, что сам узел контекста будет включен в набор.

Ось предка, включая узел контекста (ось предка или аналогичный)

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

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

Использование функций XPath позволяет находить элементы по их текстовому содержимому и по своему содержанию их атрибуты. Возможность использовать логические выражения для объединения нескольких условий для создания пути поиска значительно расширяет его возможности.

Я надеюсь, что это руководство поможет вам понять, как использовать выражения XPath при работе с Selenium Python. А также в дальнейшем послужит справочный инструмент для разработки.

Источник