Câu hỏi

Công cụ nào (tốt nhất là cho Linux) có thể chọn nội dung của một phần tử HTML dựa trên đường dẫn CSS của nó?

Thí dụ

Ví dụ: xem xét tài liệu HTML sau:

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

Chương trình dòng lệnh nào (ví dụ: một loại "cssgrep") có thể trích xuất các giá trị bằng cách sử dụng bộ chọn CSS? Đó là:

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

Chương trình sẽ viết như sau vào đầu ra tiêu chuẩn:

Tabular Content 1
Tabular Content 2

Liên kết liên quan

Cảm ơn bạn!

— Dave Jarvis
nguồn

12

Sử dụng các công cụ W3C để phân tích cú pháp HTML / XML và trích xuất nội dung bằng các bộ chọn CSS. Ví dụ:

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

Sẽ tạo ra đầu ra mong muốn:

Tabular Content 1
Tabular Content 2

Sử dụng độ dài 240 ký tự đảm bảo rằng các thành phần có nội dung dài sẽ không bị chia thành nhiều dòng. Các hxnormalize -xlệnh tạo ra một tài liệu XML cũng như hình thành, có thể được sử dụng bởi hxselect.

— Dave Jarvis
nguồn

2

Đối với người dùng macOS , brew install html-xml-utils.

— anishpatel

7

Giải pháp CSS

Lệnh Element Finder sẽ hoàn thành một phần nhiệm vụ này:

Ví dụ:

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

Điều này làm cho kết quả ở định dạng JSON, có thể được trích xuất.

Giải pháp XML

Các XML :: Twig mô-đun (" sudo apt-get install xml-twig-tools") đi kèm với một công cụ có tên xml_grepđó là có khả năng làm việc đó, với điều kiện là HTML của bạn là tốt được hình thành, tất nhiên.

Tôi xin lỗi tôi không thể kiểm tra điều này vào lúc này, nhưng một cái gì đó như thế này sẽ hoạt động:

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

— Không một
nguồn

2

https://github.com/ericchiang/pup có ngôn ngữ truy vấn dựa trên CSS phù hợp với ví dụ của bạn. Trong thực tế, với đầu vào của bạn, lệnh sau:

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

sản xuất:

Tabular Content 1
Tabular Content 2

Các trailing text{}loại bỏ các thẻ HTML.

Một tính năng hay là đường dẫn đầy đủ không cần phải được cung cấp, do đó, một lần nữa với ví dụ của bạn:

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

Một lợi thế của pupnó là sử dụng gói golang.org/x/net/html để phân tích cú pháp HTML5.

— cao điểm
nguồn

0

Nút có thể làm điều đó với JQuery và một DOM giả.

Tôi đã tạo một hình ảnh Docker cho điều đó ( 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

Đối số thứ hai là mã JavaScript, vì vậy bạn có thể làm bất cứ điều gì bạn muốn, thực sự.

— phil294
nguồn

Công cụ chọn CSS dòng lệnh

Câu hỏi

Thí dụ

Liên kết liên quan

Giải pháp CSS

Giải pháp XML