Ferramenta de seleção de CSS da linha de comandos

15

Questão

Qual ferramenta (de preferência para Linux) pode selecionar o conteúdo de um elemento HTML com base em seu caminho CSS?

Exemplo

Por exemplo, considere o seguinte 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>

Que programa de linha de comando (por exemplo, um tipo de "cssgrep") pode extrair valores usando um seletor de CSS? Isso é:

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

O programa escreveria o seguinte na saída padrão:

Tabular Content 1
Tabular Content 2

Links Relacionados

Obrigado!

command-line html grep web css Dave Jarvis
fonte

Respostas:

12

Use as ferramentas W3C para análise e extração de conteúdo HTML / XML usando seletores CSS. Por exemplo:

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

Produzirá a saída desejada:

Tabular Content 1
Tabular Content 2

Usar um comprimento de linha de 240 caracteres garante que os elementos com conteúdo longo não sejam divididos em várias linhas. O hxnormalize -xcomando cria um documento XML bem formado, que pode ser usado por hxselect.

Dave Jarvis
fonte
2
Para usuários do macOS brew install html-xml-utils,.
Anishpatel 5/05
7

Solução CSS

O comando Localizador de elementos realizará parcialmente esta tarefa:

Por exemplo:

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

Isso renderiza o resultado no formato JSON, que pode ser extraído.

Solução XML

O módulo XML :: Twig (" sudo apt-get install xml-twig-tools") vem com uma ferramenta chamada xml_grepcapaz de fazer exatamente isso, desde que seu HTML seja bem formado, é claro.

Sinto muito por não poder testar isso no momento, mas algo assim deve funcionar:

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

https://github.com/ericchiang/pup possui uma linguagem de consulta baseada em CSS que está em conformidade com o seu exemplo. De fato, com sua entrada, o seguinte comando:

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

produz:

Tabular Content 1
Tabular Content 2

O final text{}remove as tags HTML.

Um recurso interessante é que o caminho completo não precisa ser fornecido, de modo que novamente com o seu exemplo:

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

Uma vantagem pupdisso é que ele usa o pacote golang.org/x/net/html para analisar o HTML5.

pico
fonte
0

O nó pode fazer isso com o JQuery e um DOM falso.

Fiz uma imagem do Docker para isso ( 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

O segundo argumento é o código JavaScript, para que você possa realmente fazer o que quiser.

phil294
fonte