질문

CSS 경로를 기반으로 HTML 요소의 내용을 선택할 수있는 도구 (Linux에 적합)는 무엇입니까?

예

예를 들어 다음 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>

CSS 선택기를 사용하여 값을 추출 할 수있는 명령 줄 프로그램 (예 : 일종의 "cssgrep")은 무엇입니까? 그건:

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

프로그램은 다음을 표준 출력에 기록합니다.

Tabular Content 1
Tabular Content 2

관련된 링크들

감사합니다!

— 데이브 자비스
소스

12

CSS 선택기를 사용하여 HTML / XML 구문 분석 및 컨텐츠 추출에 W3C 도구 를 사용하십시오 . 예를 들면 다음과 같습니다.

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 솔루션

Element Finder 명령은이 작업을 부분적으로 수행합니다.

예를 들면 다음과 같습니다.

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

결과를 추출 할 수있는 JSON 형식으로 결과를 렌더링합니다.

XML 솔루션

XML :: 나뭇 가지 모듈 ( " 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

한 가지 장점은 pupHTML5 구문 분석에 golang.org/x/net/html 패키지를 사용한다는 것입니다.

— 피크
소스

0

노드는 JQuery와 가짜 DOM으로이를 수행 할 수 있습니다.

나는 그것을 위해 도커 이미지를 만들었다 ( 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 코드이므로 원하는대로 할 수 있습니다.

— phil294
소스

명령 줄 CSS 선택기 도구

질문

예

관련된 링크들

CSS 솔루션

XML 솔루션