Инструмент выбора CSS командной строки


15

Вопрос

Какой инструмент (предпочтительно для Linux) может выбрать содержимое элемента HTML на основе его пути CSS?

пример

Например, рассмотрим следующий HTML-документ:

<html>
<body>
  <div class="header">
  <h1>Header</h1>
  </div>
  <div class="content">
    <table>
      <tbody>
      <tr><td class="data">Tabular Content 1</td></tr>
      <tr><td class="data">Tabular Content 2</td></tr>
      </tbody>
    </table>
  </div>
  <div class="footer">
  <p>Footer</p>
  </div>
</body>
</html>

Какая программа командной строки (например, своего рода «cssgrep») может извлекать значения с помощью селектора CSS? Это:

cssgrep page.html "body > div.content > table > tbody > tr > td.data"

Программа напишет следующее в стандартный вывод:

Tabular Content 1
Tabular Content 2

Ссылки по теме

Спасибо!

Ответы:


12

Используйте инструменты W3C для разбора HTML / XML и извлечения контента с помощью селекторов CSS. Например:

hxnormalize -l 240 -x filename.html | hxselect -s '\n' -c "td.data"

Будет производить желаемый результат:

Tabular Content 1
Tabular Content 2

Использование строки длиной 240 символов гарантирует, что элементы с длинным содержимым не будут разбиты на несколько строк. Команда hxnormalize -xсоздает правильно сформированный XML-документ, который может использоваться hxselect.


2
Для пользователей MacOS brew install html-xml-utils.
анишпатель

7

Решение CSS

Команда Element Finder частично выполнит эту задачу:

Например:

elfinder -j -s td.data -x "html"

Это отображает результат в формате JSON, который можно извлечь.

Решение XML

Модуль XML :: Twig (" sudo apt-get install xml-twig-tools") поставляется с инструментом под названием, xml_grepкоторый способен сделать это, конечно, при условии, что ваш HTML правильно сформирован.

Извините, я не могу проверить это в данный момент, но что-то вроде этого должно работать:

xml_grep -t '*/div[@class="content"]/table/tbody/tr/td[@class="data"]' file.html

2

https://github.com/ericchiang/pup имеет язык запросов на основе CSS, который соответствует вашему примеру. На самом деле, с вашим вводом, следующая команда:

pup "body > div.content > table > tbody > tr > td.data text{}"

производит:

Tabular Content 1
Tabular Content 2

Трейлинг text{}удаляет теги HTML.

Одна приятная особенность заключается в том, что не нужно указывать полный путь, так что снова с вашим примером:

$ pup 'td.data text{}' < input.html
Tabular Content 1
Tabular Content 2

Одним из преимуществ pupявляется то, что он использует пакет golang.org/x/net/html для анализа HTML5.


0

Node может сделать это с помощью JQuery и поддельного DOM.

Я сделал для этого образ Docker ( https://hub.docker.com/r/phil294/jquery-jsdom/ ):

docker run --rm -i phil294/jquery-jsdom '$("body > div.content > table > tbody > tr > td.data").text()' < page.html

Второй аргумент - это код JavaScript, поэтому вы можете делать все, что захотите.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.