Найден хороший плагин XPath Helper for chrome, но хочется большего

Это предисловие я пишу уже после того, как понял, что мне нужно разделить задачи генерирования Xpath для "боевого" парсера и "экспресс-парсинга" данных с HTML страницы. Здесь же я пытался решить сразу две, окончательное решение для каждой в последующих постах, а здесь пример, пояснения и картинка для XPath Helper for chrome

Первые полустандарты использования консоли Chrome для ручного парсинга страниц с jQuery и XPath¶

1. jQuery встроен в консоль $() - выводит один элемент, $$() - выводит список элементов, $x() - список элементов по XPath запросам.

1. Для подсказок атрибутов вида //a[@class='tile-pin'] и проверки синтаксиса установить плагин XPath Helper (подробности ниже)

1. Чтобы выделить текст из тега надо добавить к строчке запроса /text()

In []:

# Вот типичная строка запроса
$x("//a[@class='tile-pin'][2]/span[@class='tile-pin__box']/span/text()") 

In []:

[Краткая справка](http://firebug.ru/commandline.html) Командная строка Firebug предоставляет специальные функции для Вашего удобства
<br/>[Firebug Tutorial 2007](http://michaelsync.net/2007/09/15/firebug-tutorial-commandline-api) Section 1: Console Tab : Using Commandline API in Firebug
<br/>[]()
<br/>[Firebug: Part 2 — commands](http://habrahabr.ru/post/50619/)
<br/>[Tip: selecting elements in Chrome developer tools and in Firebug](https://coderwall.com/p/zl6gwq/tip-selecting-elements-in-chrome-developer-tools-and-in-firebug)
<br/>[Using Chrome’s XPath with jQuery](http://keestalkstech.com/2014/02/using-chromes-xpath-with-jquery/)
<br/>[Примеры xpath-запросов к html](http://habrahabr.ru/post/114772/) браузер Mozilla Firefox с дополнениями; — firebug; — firePath;
<br/>[]()
<br/>[]()
<br/>[]()
<br/>[]()
<br/>[]()
<br/>[]()
<br/>[XPath](https://developer.mozilla.org/en-US/docs/Web/XPath)  developer.mozilla.org
<br/>[XPath Functions](https://developer.mozilla.org/en-US/docs/Web/XPath/Functions) developer.mozilla.org

XPath Helper for chrome¶

In []:

Extract, edit, and evaluate XPath queries with ease.
XPath Helper makes it easy to extract, edit, and evaluate XPath queries on any webpage.

IMPORTANT: After installing this extension, you must reload any existing tabs (or restart Chrome) for it to work on those tabs!

Instructions:
1. Open a new tab and navigate to your favorite webpage.
2. Hit Ctrl-Shift-X to open the XPath Helper console.
3. Hold down Shift as you mouse over elements on the page. The query box will continuously update to show 
    the full XPath query for the element below the mouse pointer. 
    The results box to its right will show the evaluated results for the query.
4. If desired, edit the XPath query directly in the console. The results box will immediately reflect any changes.
5. Hit Ctrl-Shift-X again to close the console.

One word of caution: When rendering HTML tables, Chrome inserts artificial <tbody> tags into the DOM, which will consequently 
show up in queries extracted by this extension.

Using Chrome’s XPath with jQuery¶

Вот несколько примеров из статьи. Автор просто присваивает переменным объекты из дерева DOM страницы, а потом делает с ними что-то... Я собственно, намереваюсь делать несто подобное. Но пока путаюсь в синтаксисе, ... (потому этот пост и появился)

In []:

var TOP_MENU = '//*[@id="header"]/div/div/div[2]/div/div[1]/ul';
var INVESTMENT_BOX = '//*[@id="content"]/div/div[1]/div[3]/div[2]';
var LAST_ROUND = '//*[@id="content"]/div/table/tbody/tr[1]/td[1]';
var LAST_ROUND_DATE = '//*[@id="content"]/div/table/tbody/tr[1]/td[3]';
var BTC_BALANCE = '//*[@id="header"]/div/div/div[2]/div/div[1]/ul/li[3]';

Почему надо использовать именно плагин XPath Helper for chrome - он не только выделяет элементы на странице, но и выводит удобный для копирования массив данных.¶

Я пока не разобрался, какой из двух вариантов формирования Xpath запроса лучше - по порядку /div[2] или по атрибутам div[@class='catalog'] Очевидно, что по атрибутам - нагляднее, но почти все плагины (особенно для Firefox) генерируют полный путь по порядковым номерам в дереве DOM. Вот пример сгенерированной в Firepath (Firebug Firefox) строчки :

In []:

html/body/div[2]/div/div[2]/div/div/div/div[2]/div/div[1]/div[7]/div[2]/a[2]/span/span

Работает хорошо, но я ищу универсальный инструмент (пока еще даже не могу сформулировать, что же толком мне надо), и мне гораздо больше нравится вот такой вариант

In []:

/html[@class=' cpf-js cpf-no-touch cpf-cssanimations cpf-csstransforms cpf-csstransforms3d cpf-csstransitions 
               cpf-mediaqueries js pm-backgroundsize pm-boxshadow pm-csstransitions pm-classlist pm-raf 
               pm-transitionend pm-dpr pm-no-retina pm-no-ie pm-requestanimationframe']
      /body
      /div[@class='page js-page page_column-left-no page_fixed']
      /div[@class='page__in js-page_in']
      /div[@class='page__body clear js-page__body']
      /div[@class='page__body__unit']
      /div[@class='page__body__unit__in']
      /div[@class='page__body__unit__box clear']
      /div[@class='page__body__main']
      /div[@class='page__body__main__box']
      /div[@class='catalog']
      /div[@class='catalog-firm'][6]
      /div[@class='tile-pin-list tile-pin-list_catalog']
      /a[@class='tile-pin'][2]
      /span[@class='tile-pin__box']
      /span[@class='tile-pin__text']

Теперь можно попробовать сформировать запрос jQuery Hpath из этой строчки¶

In []:

$x("//a[@class='tile-pin'][2]/span[@class='tile-pin__box']/span[@class='tile-pin__text']")

In []:

[
<span class=​"tile-pin__text">​Audi​</span>​
, 
<span class=​"tile-pin__text">​Daihatsu​</span>​
, 
<span class=​"tile-pin__text">​Cadillac​</span>​
, 
<span class=​"tile-pin__text">​ГАЗ​</span>​
, 
<span class=​"tile-pin__text">​BMW​</span>​
, 
<span class=​"tile-pin__text">​Aston Martin​</span>​
, 
<span class=​"tile-pin__text">​BYD​</span>​
]

Это вывод консоли, мне бы "чистый текст" получить, а не теги... Учимся ищем дальше

In []:

# Этот запрос не работает 
$x("//a[@class='tile-pin'][2]/span[@class='tile-pin__box']/span[@class='tile-pin__text']/text()")

#  А если убрать заменить span[@class='tile-pin__text'] 
$x("//a[@class='tile-pin'][2]/span[@class='tile-pin__box']/span/text()");
# то мы получим список 
[
"Audi"
, 
"Daihatsu"
, 
"Cadillac"
, 
"ГАЗ"
, 
"BMW"
, 
"Hyundai"
, 
"Aston Martin"
, 
"BYD"
]

#  Можно даже заменить span на * и получить этот же список.
$x("//a[@class='tile-pin'][2]/span[@class='tile-pin__box']/*/text()");

Припоминаю, что текст внутри тега - это отдельна нода..., так что все правильно, для нее и надо использовать text()

Ограничения Chrome (Comodo)¶

In []:

# Вот эту вырезанную из сгенерированной строчку
//div[@class='catalog']
/div[@class='catalog-firm'][6]
/div[@class='tile-pin-list tile-pin-list_catalog']
/a[@class='tile-pin'][2]
/span[@class='tile-pin__box']
/span[@class='tile-pin__text']
# Хром (Comodo) об

In [3]:

from IPython.display import Image
Image ('C:\\Users\\kiss\\Pictures\\pythonR\\xpath.png')

Out[3]:

Это иллюстрация капризов Chrome. Копипастим из верхнего (черного) окна проверенный XPath запрос в штатную консоль (a la Firebug), она выдает пустой список. Обрезаем строчку слева и копипастим (фрагмент в зеленом квадрате начинается с /a[@class= ...) в консоль, выполняем и получаем нужный нам список.

Посты чуть ниже также могут вас заинтересовать