Domanda

Quale strumento (preferibilmente per Linux) può selezionare il contenuto di un elemento HTML in base al suo percorso CSS?

Esempio

Ad esempio, considera il seguente documento 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>

Quale programma da riga di comando (ad es. Una specie di "cssgrep") può estrarre valori usando un selettore CSS? Questo è:

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

Il programma scriverà quanto segue sullo standard output:

Tabular Content 1
Tabular Content 2

Link correlati

Grazie!

— Dave Jarvis
fonte

12

Utilizzare gli strumenti W3C per l'analisi e l'estrazione di contenuto HTML / XML mediante i selettori CSS. Per esempio:

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

Produrrà l'output desiderato:

Tabular Content 1
Tabular Content 2

L'uso di una lunghezza di 240 caratteri assicura che gli elementi con contenuto lungo non vengano suddivisi su più righe. Il hxnormalize -xcomando crea un documento XML ben formato, che può essere utilizzato da hxselect.

— Dave Jarvis
fonte

2

Per gli utenti MacOS, brew install html-xml-utils.

— anishpatel

7

Soluzione CSS

Il comando Element Finder eseguirà parzialmente questa attività:

Per esempio:

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

Questo rende il risultato in formato JSON, che può essere estratto.

Soluzione XML

Il modulo XML :: Twig (" sudo apt-get install xml-twig-tools") viene fornito con uno strumento chiamato xml_grepche è in grado di fare proprio questo, purché il tuo HTML sia ben formato, ovviamente.

Mi dispiace, al momento non sono in grado di testarlo, ma qualcosa del genere dovrebbe funzionare:

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

— Zero Uno
fonte

2

https://github.com/ericchiang/pup ha un linguaggio di query basato su CSS che si conforma strettamente al tuo esempio. In effetti, con il tuo input, il seguente comando:

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

produce:

Tabular Content 1
Tabular Content 2

Il trailing text{}rimuove i tag HTML.

Una bella caratteristica è che non è necessario fornire il percorso completo, quindi di nuovo con il tuo esempio:

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

Uno dei vantaggi pupè che utilizza il pacchetto golang.org/x/net/html per l'analisi di HTML5.

— picco
fonte

0

Node può farlo con JQuery e un DOM falso.

Ho creato un'immagine Docker per questo ( 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

Il secondo argomento è il codice JavaScript, quindi puoi fare davvero tutto quello che vuoi.

— phil294
fonte

Strumento di selezione CSS da riga di comando

Domanda

Esempio

Link correlati

Soluzione CSS

Soluzione XML