Cổ vũ html không phải là một chức năng

Nút. js là một môi trường nguồn mở và đa nền tảng được xây dựng bằng công cụ chrome javascript. Nút. js được sử dụng để thực thi mã javascript từ bên ngoài trình duyệt

cổ vũ. Nó hoạt động dựa trên jQuery. Nó hoàn toàn hoạt động trên mô hình DOM nhất quán. Cheerio đôi khi được sử dụng để quét dữ liệu web và cũng được sử dụng cho các tác vụ tự động

Tiếp cận. Trong bài viết này, chúng tôi đã loại bỏ dữ liệu của đồng hồ thế giới, một trang web thông tin về covid, nơi chúng tôi nhận được tổng số trường hợp được xác nhận, tổng số ca tử vong và tổng số bệnh nhân đã hồi phục cho đến nay

Dưới đây là từng bước thực hiện

Bước 1. Nhập cmd và gõ lệnh dưới đây sẽ tạo gói. tập tin json

npm init

Bước 2. Sau khi tạo gói, tệp JSON, bạn cần cài đặt cheerio, yêu cầu và phấn từ lệnh bên dưới

Chúng tôi hiện đang làm việc trên 1. 0. 0 phát hành cổ vũ trên chi nhánh

  
Apple

  
Orange

  
Pear

7. Mã nguồn của phiên bản được xuất bản gần đây nhất,

  
Apple

  
Orange

  
Pear

8, có thể tìm thấy tại đây

Cài đặt

  
Apple

  
Orange

  
Pear

9

Đặc trưng

❤ Cú pháp quen thuộc. Cheerio thực hiện một tập hợp con của jQuery cốt lõi. Cheerio loại bỏ tất cả các điểm không nhất quán của DOM và lỗi trình duyệt khỏi thư viện jQuery, tiết lộ API thực sự tuyệt đẹp của nó

ϟ cực nhanh. Cheerio hoạt động với mô hình DOM rất đơn giản, nhất quán. Kết quả là phân tích cú pháp, thao tác và hiển thị cực kỳ hiệu quả

❁ Cực kỳ linh hoạt. Cheerio bao bọc xung quanh trình phân tích cú pháp parse5 và có thể tùy ý sử dụng htmlparser2 dễ tha thứ của @ FB55. Cheerio có thể phân tích gần như mọi tài liệu HTML hoặc XML. Cheerio hoạt động trong cả môi trường trình duyệt và Node

Cheerio không phải là một trình duyệt web

Cheerio phân tích cú pháp đánh dấu và cung cấp API để duyệt/thao tác cấu trúc dữ liệu kết quả. Nó không diễn giải kết quả như một trình duyệt web. Cụ thể, nó không tạo ra kết xuất trực quan, áp dụng CSS, tải tài nguyên bên ngoài hoặc thực thi JavaScript vốn phổ biến đối với SPA [ứng dụng một trang]. Điều này làm cho Cheerio nhanh hơn nhiều so với các giải pháp khác. Nếu trường hợp sử dụng của bạn yêu cầu bất kỳ chức năng nào trong số này, bạn nên xem xét phần mềm tự động hóa trình duyệt như Puppeteer và Playwright hoặc các dự án mô phỏng DOM như JSDom

API

Ví dụ đánh dấu chúng tôi sẽ sử dụng

  
Apple

  
Orange

  
Pear

Đây là phần đánh dấu HTML mà chúng tôi sẽ sử dụng trong tất cả các ví dụ về API

Đang tải

Trước tiên, bạn cần tải vào HTML. Bước này trong jQuery là ngầm định, vì jQuery hoạt động trên một DOM tích hợp sẵn. Với Cheerio, chúng ta cần chuyển tài liệu HTML

Đây là phương pháp ưa thích

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

Tương tự như bối cảnh trình duyệt web,

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

0 sẽ giới thiệu các thành phần , và nếu chúng chưa có. Bạn có thể đặt đối số thứ ba của

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

0 thành

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['

  

...
'];
$.html[];
//=> 
...

2 để tắt tính năng này

const $ = cheerio.load['
...
', null, false];
$.html[];
//=> '
...
'

Theo tùy chọn, bạn cũng có thể tải HTML bằng cách chuyển chuỗi dưới dạng ngữ cảnh

  
Apple

  
Orange

  
Pear

0

Hoặc như gốc

  
Apple

  
Orange

  
Pear

1

Nếu bạn cần sửa đổi các tùy chọn phân tích cú pháp cho đầu vào XML, bạn có thể chuyển một đối tượng bổ sung cho

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

3

  
Apple

  
Orange

  
Pear

3

Các tùy chọn trong đối tượng

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

4 được lấy trực tiếp từ htmlparser2, do đó, bất kỳ tùy chọn nào có thể được sử dụng trong

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5 cũng hợp lệ trong cheerio. Khi đặt

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

4, các tùy chọn mặc định là

  
Apple

  
Orange

  
Pear

7

Để biết danh sách đầy đủ các tùy chọn và tác dụng của chúng, hãy xem các tùy chọn của domhandler và htmlparser2

Sử dụng

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5

Cheerio cung cấp hai trình phân tích cú pháp,

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 

  

...

8 và

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5. Cái trước là mặc định cho HTML, cái sau là mặc định cho XML

Một số người dùng có thể muốn phân tích cú pháp đánh dấu bằng thư viện

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5 và duyệt/thao tác cấu trúc kết quả bằng Cheerio. Đây có thể là trường hợp của những người nâng cấp từ trước 1. 0 của Cheerio [dựa trên

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5], dành cho những người xử lý đánh dấu không hợp lệ [vì

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5 dễ tha thứ hơn] hoặc cho những người hoạt động trong các tình huống quan trọng về hiệu suất [vì

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5 có thể nhanh hơn trong một số trường hợp]. Lưu ý rằng "dễ tha thứ hơn" có nghĩa là

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5 có các cơ chế sửa lỗi không phải lúc nào cũng phù hợp với các tiêu chuẩn mà trình duyệt web tuân thủ. Hành vi này có thể hữu ích khi phân tích cú pháp nội dung không phải HTML

Để hỗ trợ những trường hợp này,

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

0 cũng chấp nhận cấu trúc dữ liệu tương thích với

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 

  

...

5 làm đối số đầu tiên của nó. Người dùng có thể cài đặt

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5, sử dụng nó để phân tích cú pháp đầu vào và chuyển kết quả cho

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

0

  
Apple

  
Orange

  
Pear

0

Nếu bạn muốn tiết kiệm một số byte, bạn có thể sử dụng bản xuất mỏng của Cheerio, luôn sử dụng

// ES6 or TypeScript:
import * as cheerio from 'cheerio';
// In other environments:
const cheerio = require['cheerio'];
const $ = cheerio.load['
...
'];
$.html[];
//=> 
...

5

  
Apple

  
Orange

  
Pear

2

Bộ chọn

Việc triển khai bộ chọn của Cheerio gần giống với jQuery, vì vậy API rất giống nhau

$[ bộ chọn, [ngữ cảnh], [gốc] ]

  
Apple

  
Orange

  
Pear

00 tìm kiếm trong phạm vi

  
Apple

  
Orange

  
Pear

01 tìm kiếm trong phạm vi

  
Apple

  
Orange

  
Pear

02.

  
Apple

  
Orange

  
Pear

00 và

  
Apple

  
Orange

  
Pear

01 có thể là một biểu thức chuỗi, Phần tử DOM, mảng các phần tử DOM hoặc đối tượng cổ vũ.

  
Apple

  
Orange

  
Pear

02 thường là chuỗi tài liệu HTML

Phương thức bộ chọn này là điểm bắt đầu để duyệt và thao tác với tài liệu. Giống như jQuery, đây là phương thức chính để chọn các phần tử trong tài liệu

  
Apple

  
Orange

  
Pear

0Không gian tên XML

Bạn có thể chọn bằng Không gian tên XML nhưng do đặc tả CSS, dấu hai chấm [

  
Apple

  
Orange

  
Pear

06] cần được thoát để bộ chọn hợp lệ

  
Apple

  
Orange

  
Pear

1

kết xuất

Khi bạn đã sẵn sàng hiển thị tài liệu, bạn có thể gọi phương thức

  
Apple

  
Orange

  
Pear

07 trên lựa chọn "root"

  
Apple

  
Orange

  
Pear

2

Nếu bạn muốn hiển thị

  
Apple

  
Orange

  
Pear

08 của vùng chọn, bạn có thể sử dụng chức năng tiện ích

  
Apple

  
Orange

  
Pear

07

  
Apple

  
Orange

  
Pear

3

Bạn cũng có thể hiển thị nội dung văn bản của đối tượng Cheerio bằng phương thức tĩnh

  
Apple

  
Orange

  
Pear

10

  
Apple

  
Orange

  
Pear

4

bổ sung

Khi bạn đã tải tài liệu, bạn có thể mở rộng nguyên mẫu hoặc thuộc tính

  
Apple

  
Orange

  
Pear

11 tương đương bằng các phương thức plugin tùy chỉnh

  
Apple

  
Orange

  
Pear

5

Nếu đang sử dụng TypeScript, bạn nên thêm định nghĩa kiểu cho phương thức mới của mình

  
Apple

  
Orange

  
Pear

6

Đối tượng "Nút DOM"

Bộ sưu tập Cheerio được tạo thành từ các đối tượng có một số điểm tương đồng với các nút DOM dựa trên trình duyệt. Bạn có thể mong đợi họ xác định các thuộc tính sau

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  12

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  13

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  14

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  15

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  16

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  17

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  18

• 
    
  Apple
  
    
  Orange
  
    
  Pear
  
  
  

  19

Screencasts

https. //vimeo. com/31950192

Hướng dẫn bằng video này là phần tiếp theo của Nettut "Cách quét các trang web bằng nút. js và jQuery", sử dụng cheerio thay vì JSDOM + jQuery. Video này cho thấy việc sử dụng cheerio dễ dàng như thế nào và cheerio nhanh hơn nhiều so với JSDOM + jQuery

Cheerio trong thế giới thực

Bạn đang sử dụng cổ vũ trong sản xuất?

Công ty của bạn có sử dụng Cheerio trong sản xuất không? . Sự giúp đỡ của bạn sẽ cho phép những người bảo trì dành nhiều thời gian và nguồn lực hơn cho sự phát triển và hỗ trợ của nó

ủng hộ

Trở thành người ủng hộ để thể hiện sự ủng hộ của bạn dành cho Cheerio và giúp chúng tôi duy trì cũng như cải thiện dự án mã nguồn mở này