Поиск данных на веб-страницах с помощью XPath

Мы предполагаем, что используется Google Chrome или Яндекс.Браузер. Для работы в Firefox желательно предварительно установить дополнения Firebug и Firepath.

XPath или XML Path Language — это язык запросов к элементам XML- и HTML-документов. Запрос нужен затем, чтобы получить из этих документов какую-то нужную нам информацию. Допустим, у нас есть следующая веб-страница

и мы хотим узнать из нее дату создания аннотации, хранящуюся в элементе <p> с идентификатором date (01.01.2015).

Проследим путь к этому элементу от начала документа:

<html> -- все содержимое страницы, в том числе и дата, находится внутри этого элемента;
<body> - сузим область поиска до «тела» страницы;
<div> - дата содержится в первом из двух подобных элементов;
<p> - дата находится внутри абзаца. Второй <div> сразу отпадает – в нем нет абзацев;
абзац с идентификатором (id) date.

Запишем этот путь следующим образом:

/html/body/div/p[@id='date']

Это и будет запрос XPath – путь к нужному нам элементу.

Искомый элемент во вкладке "Elements"

XPath-запрос в консоли разработчика

Найденный элемент страницы подсвечивается

Одиночный слеш «/» в начале означает, что путь – абсолютный, т.е. от начала документа.

В квадратных скобках возле p стоят дополнительные условия поиска. Нам ведь нужны не все абзацы внутри <div>, а только абзац с заданным id. Если бы нам понадобилось найти абзац, принадлежащий к заданному классу, то условие выглядело бы так: [@class='имя_класса']. Например, путь:

/html/body/p[@class='abstract']

Указывает на второй абзац текста.

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

$x("/html/body/p[@class='abstract']")

Иначе

Абсолютный путь можно заменить относительным, т.е. путем от заданного места документа. Относительный путь начинается с двойного слеша «//». Например, //div означает путь от предка элемента <div>, т.е. <body>, и в результате запроса

$x("//div")

Будут найдены оба элемента <div>. Точнее, запрос возвратит список из двух <div>-ов. Выбрать <div>, содержащий аннотацию, можно по его номеру: он 1-й в списке, а нумерация начинается с единицы

$x("//div[1]")

С помощью относительного пути запрос, возвращающий дату, сокращается до

$x("//div/p[@id='date']")

Но и этот путь можно сократить, ведь нужный нам абзац обладает уникальным именем date:

$x("//p[@id='date']")

О консоли разработчика можно прочитать здесь и здесь.
О поиске информации с помощью CSS-селекторов -- здесь.

Читайте также

Комментарии