Інструмент вибору 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.
anishpatel

7

CSS Рішення

Команда Finder Elements частково виконає це завдання:

Наприклад:

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

Вузол може це зробити з 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.