Befehlszeilen-CSS-Auswahlwerkzeug

15

Frage

Welches Tool (vorzugsweise für Linux) kann den Inhalt eines HTML-Elements anhand seines CSS-Pfads auswählen?

Beispiel

Betrachten Sie beispielsweise das folgende HTML-Dokument:

<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>

Welches Befehlszeilenprogramm (z. B. eine Art "cssgrep") kann Werte mit einem CSS-Selektor extrahieren? Das ist:

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

Das Programm würde Folgendes in die Standardausgabe schreiben:

Tabular Content 1
Tabular Content 2

ähnliche Links

Vielen Dank!

command-line html grep web css Dave Jarvis
quelle

Antworten:

12

Verwenden Sie die W3C-Tools zum HTML / XML-Parsen und Extrahieren von Inhalten mithilfe von CSS-Selektoren. Zum Beispiel:

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

Erzeugt die gewünschte Ausgabe:

Tabular Content 1
Tabular Content 2

Durch die Verwendung einer Zeilenlänge von 240 Zeichen wird sichergestellt, dass Elemente mit langem Inhalt nicht auf mehrere Zeilen aufgeteilt werden. Der hxnormalize -xBefehl erstellt ein wohlgeformtes XML-Dokument, das von verwendet werden kann hxselect.

Dave Jarvis
quelle
2
Für MacOS-Benutzer brew install html-xml-utils.
Anishpatel
7

CSS-Lösung

Der Befehl Element Finder führt diese Aufgabe teilweise aus:

Zum Beispiel:

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

Dadurch wird das Ergebnis im JSON-Format dargestellt, das extrahiert werden kann.

XML-Lösung

Das XML :: Twig- Modul (" sudo apt-get install xml-twig-tools") enthält ein Tool mit dem Namen xml_grep, das genau das kann, vorausgesetzt, Ihr HTML ist natürlich gut geformt.

Es tut mir leid, dass ich das momentan nicht testen kann, aber so etwas sollte funktionieren:

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

https://github.com/ericchiang/pup verfügt über eine CSS-basierte Abfragesprache, die genau Ihrem Beispiel entspricht. In der Tat, mit Ihrer Eingabe, den folgenden Befehl:

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

produziert:

Tabular Content 1
Tabular Content 2

Das Trailing text{}entfernt die HTML-Tags.

Eine nette Funktion ist, dass nicht der vollständige Pfad angegeben werden muss, so dass noch einmal mit Ihrem Beispiel:

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

Ein Vorteil pupist, dass das Paket golang.org/x/net/html zum Parsen von HTML5 verwendet wird.

Gipfel
quelle
0

Node kann das mit JQuery und einem gefälschten DOM tun.

Ich habe dafür ein Docker-Image erstellt ( 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

Das zweite Argument ist JavaScript-Code, sodass Sie wirklich alles tun können, was Sie wollen.

phil294
quelle