DOMContentLoaded so với Sự kiện Load: Giải thích Mức độ Sẵn sàng của Trang

DOMContentLoaded so với Sự kiện Load

Scrapeless Agent Browser cung cấp các phiên trình duyệt để điều hướng các trang động và kiểm tra nội dung đã được kết xuất của chúng thông qua các client tương thích.

Tóm tắt

  • DOMContentLoaded đánh dấu một cột mốc phân tích (parsing) tài liệu. Nó không đảm bảo rằng dữ liệu ứng dụng đến sau đó đã xuất hiện.
  • Sự kiện load của window diễn ra sau các tài nguyên trì hoãn việc load cho tài liệu. Nó vẫn không có nghĩa là mọi trạng thái UI trong tương lai đều đã hoàn tất.
  • Các mốc điều hướng và mức độ sẵn sàng dữ liệu là những điều kiện khác nhau. Hãy chờ đến trạng thái được yêu cầu bởi tác vụ trích xuất.
  • Một mạng yên ắng là một quan sát riêng biệt. Lưu lượng nền và các hành động trong tương lai khiến nó không thể trở thành một định nghĩa sẵn sàng mang tính phổ quát.

Phân biệt Các Cột Mốc Tài Liệu với Hoàn Thành Tác Vụ

DOMContentLoaded và sự kiện load của window mô tả các thời điểm khác nhau trong vòng đời của một tài liệu. Chúng là các mốc điều hướng hữu ích, nhưng không sự kiện nào là tín hiệu phổ quát cho thấy ứng dụng đã hoàn thành công việc mà bộ thu thập dữ liệu của bạn cần.

Mô hình phân tích HTML và vòng đời định nghĩa cách việc xử lý tài liệu và thực thi script dẫn đến các sự kiện vòng đời. DOMContentLoaded diễn ra sau khi phân tích và thực thi các script hoãn phù hợp. Sự kiện load của window xảy ra muộn hơn trong chuỗi tải tài liệu sau khi các tài nguyên trì hoãn sự kiện đó đã hoàn tất.

Một ứng dụng có thể yêu cầu dữ liệu sau bất kỳ cột mốc nào. Một hành động của người dùng có thể kích hoạt một yêu cầu khác muộn hơn nhiều. Một trang cũng có thể đạt đến một sự kiện vòng đời trong khi đang hiển thị lỗi hoặc thách thức. Diễn giải sự kiện như bằng chứng về việc xử lý tài liệu, sau đó kiểm tra riêng nội dung dự định cho tác vụ.

So sánh Nhanh Các Sự kiện

Sự kiện bạn chọn nên khớp với công việc bạn cần quan sát. Việc đọc tiêu đề trang và một lưới sản phẩm đã được điền dữ liệu có thể cần các điều kiện hoàn tất khác nhau.

Câu hỏiDOMContentLoadedSự kiện Load của Window
Nó đại diện cho cột mốc nào?Hoàn tất phân tích và các script hoãn liên quanHoàn tất tải tài liệu muộn hơn
Nó có chờ mọi ảnh không?KhôngChờ các tài nguyên trì hoãn load, với các ngoại lệ như lazy loading
Nó có đảm bảo dữ liệu ứng dụng không?KhôngKhông
Trang có thể thay đổi sau đó không?CóCó
Quy tắc trích xuất phù hợpThêm một điều kiện cụ thể cho tác vụThêm một điều kiện cụ thể cho tác vụ

So sánh này liên quan đến sự kiện load của window của tài liệu, không phải sự kiện load riêng của từng phần tử tài nguyên. Một ảnh, script, hoặc frame có thể có mục tiêu sự kiện và thời điểm riêng. Xác định sự kiện mà client của bạn đang quan sát khi gỡ lỗi một lần chờ.

Hiểu Cách Việc Tải Script Ảnh Hưởng Đến Thời Điểm

Hành vi script ảnh hưởng đến các cột mốc tài liệu, vì vậy một lời giải thích đơn giản kiểu trước-ảnh so với sau-ảnh là không đầy đủ. Script chặn phân tích, script hoãn (defer), module và script bất đồng bộ có các mối quan hệ khác nhau với việc phân tích và thời điểm sự kiện.

Một script chạy trong khi đang phân tích có thể làm chậm bộ phân tích. Thực thi script hoãn tham gia vào chuỗi trước DOMContentLoaded. Công việc bất đồng bộ có thể hoàn tất độc lập, và một ứng dụng có thể lên lịch các cập nhật sau này bất kể chế độ tải script ban đầu.

Stylesheet cũng có thể gián tiếp ảnh hưởng đến thời điểm script khi việc thực thi script phải chờ chúng. Tránh phát biểu chung chung rằng DOMContentLoaded chờ mọi stylesheet. Các phụ thuộc là quan trọng, và thiết kế tải cụ thể của trang quyết định chuỗi được quan sát.

Để chẩn đoán, hãy ghi lại khi nào nội dung cần thiết trở nên quan sát được so với cột mốc. Một phần tử mang dữ liệu xuất hiện sau DOMContentLoaded cho bạn biết chỉ riêng sự kiện đó là chưa đủ. Một phần tử bị thiếu sau load có thể cho thấy công việc ứng dụng bị trì hoãn, trạng thái trang sai, hoặc thực sự vắng mặt. Kiểm tra tài liệu trước khi thay đổi thời gian chờ.

Xác định "Sẵn sàng" Nghĩa Là Gì Cho Bản Ghi Cần Thiết

Mức độ sẵn sàng dữ liệu nên mô tả trạng thái cần thiết để tạo ra một bản ghi hợp lệ. Hãy xác định trạng thái đó từ hợp đồng trường dữ liệu thay vì từ một sự kiện toàn cục tiện dụng.

Đối với tác vụ chi tiết sản phẩm, một trạng thái sẵn sàng có thể yêu cầu định danh sản phẩm dự định và một trường giá đã ổn định. Đối với tác vụ bài viết, nó có thể yêu cầu tiêu đề và vùng thân bài viết. Đối với danh sách tìm kiếm, nó có thể yêu cầu vùng chứa kết quả hoặc một thông báo không-có-kết-quả rõ ràng.

Sự tồn tại của một vùng chứa đơn thuần có thể là quá yếu. Nhiều ứng dụng tạo vùng chứa trước khi điền dữ liệu. Một tiêu đề hiển thị đơn thuần cũng có thể là quá yếu nếu cùng một trang chứa khung tải hoặc lựa chọn trước đó. Hãy chọn một điều kiện có thể quan sát được để phân biệt các trạng thái đó.

Giữ điều kiện ở mức giới hạn. Nếu trạng thái yêu cầu không xuất hiện trong khoảng thời gian chờ được phép của tác vụ, hãy giữ lại bằng chứng về lỗi và phân loại kết quả là chưa hoàn thành. Không được tự động chuyển đổi việc chờ hết thời gian thành một bộ dữ liệu trống. Trạng thái trống rõ ràng và một kết quả chưa được quan sát có ý nghĩa khác nhau.

Xử lý Tài liệu Hiện có và Điều hướng Mới Riêng biệt

Một sự kiện vòng đời thuộc về một phiên bản tài liệu. Nếu client của bạn bắt đầu quan sát sau khi sự kiện đã được kích hoạt, việc thêm một listener mới sẽ không phát lại sự kiện đã xảy ra trước đó. Hãy sử dụng hành vi điều hướng và trạng thái tải được tài liệu hóa của client tự động hóa cho một trang hiện có.

The Mô hình phân phát sự kiện DOM giải thích lý do tại sao một lần xảy ra sự kiện và một lần kiểm tra tài liệu sau đó là những quan sát khác nhau. Ghi lại lần điều hướng nào đã tạo ra tài liệu và liệu phía khách có đang chờ lần điều hướng đó hay đang kiểm tra một trang đã được mở sẵn.

Các chuyển đổi trong ứng dụng một trang có thể thay đổi nội dung hiển thị mà không tạo ra cùng một chuỗi tải tài liệu đầy đủ như một điều hướng mới. Việc thay đổi route, chọn bộ lọc hoặc thao tác với modal có thể yêu cầu một kiểm tra hoàn tất đặc thù cho ứng dụng thay vì một sự kiện tải cửa sổ khác.

Khi một lần nhấp chuột mở một tab mới, vòng đời của tab gốc nói rất ít về trang mới. Xác định trang đích và kiểm tra trạng thái của nó. Giữ cho hành động và quan sát được gắn với cùng một ngữ cảnh dự định.

Xem Network Idle như một heuristic riêng biệt

Network idle là một quan sát do phía client xác định về hoạt động mạng, không phải một sự kiện vòng đời HTML. Tính hữu ích của nó phụ thuộc vào trang và định nghĩa của thư viện tự động hóa.

Một trang có phân tích, thăm dò ý kiến hoặc phát trực tuyến có thể vẫn hoạt động sau khi dữ liệu cần thiết đã sẵn sàng. Một trang khác có thể trở nên im lặng trước khi một bộ hẹn giờ muộn hơn hoặc một tương tác điền vào một trường. Do đó, sự im lặng của mạng không nên thay thế cho một hợp đồng dữ liệu.

Kiểm tra xem những yêu cầu nào ảnh hưởng đến đầu ra. Nếu một yêu cầu ứng dụng cụ thể điền vào vùng mục tiêu, trạng thái nội dung được chấp nhận thường là một ranh giới rõ ràng hơn so với từng yêu cầu trên trang. Giữ chẩn đoán mạng luôn sẵn sàng mà không biến hoạt động nền không liên quan thành điều kiện cho tất cả các thao tác trích xuất bổ sung.

Thời gian ngủ cố định cũng có những hạn chế tương tự. Nó đo thời gian đã trôi qua, chứ không đo tính đúng đắn của trường. Chỉ sử dụng nó khi tác vụ có yêu cầu thời gian chính đáng, và vẫn phải kiểm tra tính đúng đắn của nội dung thu được. Đừng mô tả một khoảng trễ tình cờ hiệu quả một lần như bằng chứng cho sự sẵn sàng nói chung.

Tránh chấp nhận nhầm tài liệu một cách vội vàng

Một mốc nhanh có thể khiến một trang không chính xác trông giống như một lần điều hướng thành công. Hãy kiểm tra URL cuối cùng và định danh tài liệu trước khi áp dụng việc trích xuất trường.

The Trạng thái HTTP và ngữ nghĩa phản hồi mô tả việc trao đổi phản hồi, trong khi vòng đời của trình duyệt mô tả việc xử lý tài liệu thu được. Một phản hồi HTTP thành công có thể chứa một trang dự phòng, và một tài liệu đã tải có thể chứa một thử thách truy cập. Không tín hiệu nào chứng minh rằng bài viết hoặc sản phẩm được yêu cầu đã được lấy.

Ghi lại URL được yêu cầu, URL cuối cùng, tiêu đề, tiêu đề liên quan và khu vực bắt buộc. Nếu trang chứa trạng thái lỗi rõ ràng, hãy loại bỏ nó khỏi việc chấp nhận dữ liệu thông thường. Nếu bản ghi bắt buộc vắng mặt, hãy kiểm tra xem trang có đại diện cho một kết quả trống hay trạng thái ứng dụng chưa hoàn chỉnh hay không.

Các tài sản tùy chọn cần có tiêu chí chấp nhận riêng. Việc trích xuất văn bản có thể không yêu cầu tất cả hình ảnh, trong khi một bản chụp trực quan có thể phụ thuộc vào phông chữ, việc tải hình ảnh và bố cục mong muốn. Chiến lược chờ đợi nên tuân theo sản phẩm bàn giao thay vì một ưu tiên sự kiện mang tính phổ quát.

So sánh các chiến lược chờ trên các trang đại diện

Một đánh giá thời gian chờ hữu ích đo lường thời điểm nhiệm vụ trở nên hợp lệ, chứ không chỉ khi việc điều hướng được hoàn tất. Hãy sử dụng các loại trang mang tính đại diện và giữ nguyên các kiểm tra nội dung cùng với quan sát về thời gian.

So sánh một tài liệu tĩnh, một bản ghi được điền bởi phía client, một trạng thái trống được chỉ định rõ ràng và một trang có hoạt động nền đang diễn ra. Ghi lại mốc đã xảy ra và liệu các trường bắt buộc đã thực sự sẵn sàng hay chưa. Một chiến lược tạo ra các bản ghi nhanh nhưng không đầy đủ không nên được coi là trích xuất thành công nhanh hơn.

Đối với các giao diện thay đổi, hãy giữ lại một bản ghi chẩn đoán hiển thị vùng cần thiết và định danh của nó. Nếu một bộ chọn sau đó bị lỗi, bằng chứng này giúp phân biệt sự trôi dạt cấu trúc với vấn đề thời gian. Thời gian chờ lâu hơn không thể sửa một bộ chọn dành cho một bố cục khác.

# Use Agent Browser with a Content Acceptance Condition In @@CODEBLOCK_0@@, click the Browser icon, and select @@INLINECODE_0@@. Under “@@INLINECODE_1@@”, select “@@INLINECODE_2@@”. This will tell the browser to search for pages where an `<h1>` contains the same text that the user submitted. ## Using the “Extract Structured Data” Tool Use this tool to extract content from multiple pages at once according to a specific schema for all articles from a news website. 1. Click the Browser icon and select "Extract structured data". 2. Under Content selector, you can enter a CSS selector or XPath query to specify which HTML elements to match on a page. You can update this selector using the Structured Data Schema tool. 3. Click Add website to enter the URLs that the browser should visit and extract content from. > [!tip] > Clicking ‘Use seed and crawl’ enables the browser to find, extract from, and follow links to other similar pages on the same website. Click Run to start the browser.

Trình duyệt Tác nhân Không Cần Thu Thập Dữ Liệu cung cấp môi trường thực thi để quan sát các trang động. Phiên bản duyệt web của Trợ lý không loại bỏ nhu cầu phải có một khoảng chờ cụ thể cho khách hàng và một điều kiện chấp nhận cụ thể cho bản ghi.

The quy trình điều hướng trình duyệt do tác nhân điều khiển cung cấp ngữ cảnh liên quan cho các hành động trang được kiểm soát. Làm theo hướng dẫn hiện tại của client để triển khai và giữ cho trạng thái trang cần thiết được thể hiện rõ ràng. Trang này so sánh ngữ nghĩa sự kiện mà không khẳng định một thiết lập thời gian chờ dịch vụ mang tính phổ quát.

Xem xét Bảng giá Scrapeless chống lại công việc phiên tạo ra các kết quả hợp lệ. Việc chờ đợi không cần thiết các tài nguyên không liên quan có thể tốn thời gian, trong khi chấp nhận một bản ghi quá sớm sẽ tạo ra lỗi dữ liệu ở các bước sau. Hãy đánh giá cả hai hậu quả trong tác vụ thực tế.

Kết luận: Hãy chờ đợi bằng chứng mà bạn cần

Sử dụng DOMContentLoaded hoặc load như một mốc tài liệu, sau đó thêm một điều kiện gắn với nội dung được yêu cầu. Xác nhận danh tính trang, phân biệt kết quả rỗng rõ ràng với việc hiển thị chưa hoàn tất, và chọn các kiểm tra trực quan hoặc dữ liệu theo loại sản phẩm cần giao. Thời điểm chờ phù hợp kết thúc khi bằng chứng cho nhiệm vụ là đủ.

Xác định Mức độ Sẵn sàng của Trang cho Tác vụ Trình duyệt của Bạn

Điều hướng đến một nguồn được ủy quyền và chấp nhận bản ghi chỉ khi trạng thái nội dung được yêu cầu có thể quan sát được.

Đăng ký ngay hôm nay và nhận $5 tín dụng miễn phí — không cần thẻ tín dụng.

Nhận $5 tín dụng của bạn →

Câu hỏi thường gặp

Hỏi: DOMContentLoaded có nghĩa là mọi script đã chạy xong không?

DOMContentLoaded không có nghĩa là mọi script hoặc tác vụ bất đồng bộ có thể có đều đã hoàn thành. Thời điểm của nó gắn với việc phân tích cú pháp và thực thi hoãn có liên quan. Công việc ứng dụng diễn ra sau đó vẫn có thể thay đổi tài liệu, vì vậy hãy dùng điều kiện nội dung cho các trường được điền sau đó.

Hỏi: Sự kiện load có chờ mọi ảnh không?

Sự kiện load của window chờ các tài nguyên làm chậm việc tải tài liệu, nhưng những ngoại lệ như ảnh tải lười (lazy-loaded) là quan trọng. Nó không đảm bảo rằng mọi ảnh được yêu cầu bởi tương tác về sau đều đã xuất hiện. Việc chụp giao diện trực quan cần tiêu chí riêng về tài nguyên và bố cục.

Hỏi: Việc scraping có luôn phải chờ load không?

Scraping không nên luôn dùng load như quy tắc chấp nhận hoàn tất. Một số dữ liệu sẵn sàng sớm hơn, và một số dữ liệu ứng dụng đến muộn hơn. Hãy chọn một cột mốc phù hợp với điều hướng và kiểm tra riêng trạng thái trang bắt buộc.

Hỏi: Network idle có đáng tin hơn chờ selector không?

Network idle không phải lúc nào cũng đáng tin hơn một điều kiện nội dung dành riêng cho tác vụ. Các yêu cầu nền có thể tiếp tục sau khi dữ liệu hữu ích đã sẵn sàng, và công việc mới có thể bắt đầu sau khoảng lặng. Hãy ưu tiên một điều kiện quan sát được trực tiếp xác định bản ghi cần thiết.

Hỏi: Tại sao thay đổi bộ lọc không kích hoạt sự kiện DOMContentLoaded mới?

Thay đổi bộ lọc có thể cập nhật một tài liệu hiện có mà không có điều hướng tài liệu đầy đủ mới. DOMContentLoaded thuộc về quá trình xử lý tài liệu, không phải mọi cập nhật giao diện. Thay vào đó, hãy quan sát trạng thái được chấp nhận của bộ lọc và các bản ghi kết quả.

Tài liệu tham khảo