Бывают случаи, когда нам нужно получить доступ к элементам (обычно текстам), которые находятся в таблицах HTML. Однако веб-дизайнер очень редко предоставляет атрибут id или name для определенной ячейки в таблице. Поэтому мы не можем использовать обычные методы, такие как «By.id ()», «By.name ()» или «By.cssSelector ()». В этом случае наиболее надежным вариантом является доступ к ним с помощью метода «By.xpath ()».
В этом руководстве вы узнаете:
Как написать XPath для таблицы
Доступ к вложенным таблицам
Использование атрибутов в качестве предикатов
Ярлык: используйте элемент Inspect для доступа к таблицам в Selenium
Как написать XPath для таблицы
Рассмотрим HTML-код ниже.
Мы будем использовать XPath для получения внутреннего текста ячейки, содержащей текст «четвертая ячейка».
Шаг 1 - Установите родительский элемент (таблица)
Локаторы XPath в WebDriver всегда начинаются с двойной косой черты «//», за которой следует родительский элемент . Поскольку мы имеем дело с таблицами, родительским элементом всегда должен быть тег
. Поэтому первая часть нашего локатора XPath должна начинаться с «// table».
Шаг 2 - Добавьте дочерние элементы
Элемент непосредственно под
- это
, поэтому мы можем сказать, что
является «дочерним элементом»
. А также
является «родителем»
. Все дочерние элементы в XPath помещаются справа от своего родительского элемента, разделенные одной косой чертой «/», как в коде, показанном ниже.
Шаг 3 - Добавьте предикаты
Элемент
содержит два тега
. Теперь мы можем сказать, что эти два тега
являются «дочерними» для
. Следовательно, мы можем сказать, что
является родителем обоих элементов
.
Еще мы можем сделать вывод, что два элемента
являются братьями и сестрами. Братья и сестры относятся к дочерним элементам, имеющим одного и того же родителя .
Чтобы добраться до
, к которому мы хотим получить доступ (с текстом «четвертая ячейка»), мы должны сначала получить доступ ко второму
, а не к первому. Если мы просто напишем «// table / tbody / tr», тогда мы получим доступ к первому тегу
.
Итак, как же тогда получить доступ ко второму
? Ответ на этот вопрос - использовать предикаты .
Предикаты - это числа или атрибуты HTML, заключенные в пару квадратных скобок «[]», которые отличают дочерний элемент от его братьев и сестер . Поскольку
, к которому нам нужно получить доступ, является вторым, мы будем использовать «[2]» в качестве предиката.
Если мы не будем использовать какой-либо предикат, XPath получит доступ к первому родственнику. Следовательно, мы можем получить доступ к первому
, используя любой из этих кодов XPath.
Шаг 4 - Добавьте последующие дочерние элементы, используя соответствующие предикаты
Следующий элемент, к которому нам нужно получить доступ, - это второй
. Применяя принципы, изученные на шагах 2 и 3, мы доработаем наш код XPath, чтобы он был похож на показанный ниже.
Теперь, когда у нас есть правильный локатор XPath, мы уже можем получить доступ к ячейке, к которой мы хотели, и получить ее внутренний текст, используя приведенный ниже код. Предполагается, что вы сохранили приведенный выше HTML-код как «newhtml.html» на своем диске C.
Те же принципы, о которых говорилось выше, применимы к вложенным таблицам. Вложенные таблицы - это таблицы, расположенные внутри другой таблицы . Пример показан ниже.
Чтобы получить доступ к ячейке с текстом «4-5-6» с использованием концепций «// родитель / потомок» и предиката из предыдущего раздела, мы должны иметь возможность придумать код XPath ниже.
Приведенный ниже код WebDriver должен иметь возможность извлекать внутренний текст ячейки, к которой мы обращаемся.
Приведенные ниже выходные данные подтверждают, что доступ к внутренней таблице был выполнен успешно.
Использование атрибутов в качестве предикатов
Если элемент написан глубоко внутри HTML-кода, так что число, используемое для предиката, очень трудно определить, мы можем вместо этого использовать уникальный атрибут этого элемента.
В приведенном ниже примере ячейка «Нью-Йорк - Чикаго» расположена глубоко в HTML-коде домашней страницы Mercury Tours.
В этом случае мы можем использовать уникальный атрибут таблицы (width = "270") в качестве предиката. Атрибуты используются в качестве предикатов, добавляя к ним префикс @ . В приведенном выше примере ячейка «Нью-Йорк - Чикаго» расположена в первом
четвертого
, поэтому наш XPath должен быть таким, как показано ниже.
Помните, что когда мы помещаем код XPath в Java, мы должны использовать escape-символ обратной косой черты «\» для двойных кавычек с обеих сторон от «270», чтобы строковый аргумент By.xpath () не завершался преждевременно. .
Теперь мы готовы получить доступ к этой ячейке, используя приведенный ниже код.
Ярлык: используйте элемент Inspect для доступа к таблицам в Selenium
Если номер или атрибут элемента получить чрезвычайно сложно или невозможно, самый быстрый способ сгенерировать код XPath - использовать Inspect Element.
Рассмотрим приведенный ниже пример с домашней страницы Mercury Tours.
Шаг 1
Используйте Firebug, чтобы получить код XPath.
Шаг 2
Найдите первый родительский элемент "table" и удалите все, что находится слева от него.
Шаг 3
Перед оставшейся частью кода поставьте двойную косую черту «//» и скопируйте ее в свой код WebDriver.
Приведенный ниже код WebDriver сможет успешно получить внутренний текст элемента, к которому мы обращаемся.
By.xpath () обычно используется для доступа к элементам таблицы.
Если элемент написан глубоко внутри HTML-кода, так что число, используемое для предиката, очень трудно определить, мы можем вместо этого использовать уникальный атрибут этого элемента.
Атрибуты используются в качестве предикатов, добавляя к ним префикс @.
Используйте элемент Inspect для доступа к таблицам в Selenium