Nói chung, một siêu liên kết được sử dụng để liên kết một tài liệu PDF để hiển thị trong trình duyệt. Liên kết neo HTML là cách dễ nhất để hiển thị tệp PDF. Nhưng nếu bạn muốn hiển thị tài liệu PDF trên trang web, tệp PDF cần được nhúng trong HTML. HTMLtag là tùy chọn tốt nhất để nhúng tài liệu PDF vào trang web. Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách hiển thị tệp PDF trong trang web bằng cách sử dụng HTMLtag Show
Thẻ HTML định nghĩa vùng chứa để tải nội dung bên ngoài trong trang web. Các tham số sau có thể được chỉ định trong thẻ
Nhúng tệp PDF vào HTMLSử dụng đoạn mã sau để nhúng tệp PDF vào trang web HTML Cấu hình xem tài liệu PDFBây giờ chúng tôi sẽ chỉ cho bạn cách kiểm soát chế độ xem tài liệu PDF trên trang web. Sử dụng các tham số trong URL, bạn có thể chỉ định chính xác nội dung sẽ hiển thị và cách hiển thị tài liệu PDF
Chỉ định Tham số trong URLBạn có thể chỉ định nhiều tham số trong URL. Mỗi tham số phải được phân tách bằng ký tự dấu và ( http://example.com/doc.pdf#Chapter5 http://example.com/doc.pdf#page=5 http://example.com/doc.pdf#page=3&zoom=200,250,100 http://example.com/doc.pdf#zoom=100 http://example.com/doc.pdf#page=72&view=fitH,100 Tắt và Ẩn Thanh công cụ trong PDF Web ViewerVí dụ này cho biết cách ẩn hoặc xóa thanh công cụ, bảng điều hướng và thanh cuộn của tệp PDF được mở trong HTML bằng cách sử dụng các tham số trong URL Sử dụng đoạn mã sau để nhúng tài liệu PDF vào trang web và xóa hoặc ẩn thanh công cụ của tệp PDF được nhúng Chuyển đổi HTML sang PDF bằng JavaScript Bạn có muốn nhận trợ giúp triển khai hay sửa đổi hoặc nâng cao chức năng của tập lệnh này không? Trong bài viết này, chúng ta sẽ tìm hiểu cách nhúng tệp PDF vào tài liệu HTML, cùng với việc biết cách triển khai chúng thông qua các ví dụ. Đôi khi, bạn có thể muốn chèn tệp PDF vào tài liệu hoặc mã HTML để làm cho nội dung tương tác hơn. Bởi vì các định dạng rất khác nhau, không dễ để hoàn thành nhiệm vụ. Để học cách thêm file PDF vào code HTML, bạn cần biết cách convert file bằng phần mềm PDF, đây là kiến thức tiên quyết. Bố cục tĩnh của PDF khiến nó không tương thích với thiết kế đáp ứng của HTML. Để chèn PDF vào HTML, trước tiên chúng ta phải chuyển đổi tệp. Một cách khác là nhúng mã PDF HTML vào một trang web để làm cho nó tương tác. Các phương pháp nhúng sau đây có thể được sử dụng để thêm PDF vào tệp HTML
Chúng tôi sẽ khám phá và hiểu chi tiết các phương pháp này thông qua việc triển khai chúng Phương pháp 1. Sử dụng thẻ đối tượng Thẻ đối tượng HTML là cách đầu tiên để nhúng tệp PDF. Trong ví dụ dưới đây, tệp pdf sẽ được hiển thị trên một trang web, là một đối tượng Ngoài việc nhúng tệp pdf vào trang web, thẻ đối tượng có thể nhúng các ứng dụng ActiveX, Flash, video, âm thanh và Java. Các tài liệu tương tác có thể được đính kèm vào một đối tượng được nhúng bằng thẻ HTML. Nó có thể được hiển thị theo nhu cầu của bạn trên màn hình bằng cách sử dụng các thuộc tính chiều cao và chiều rộng của đối tượng ví dụ 1. Ví dụ này mô tả việc nhúng tệp PDF vào HTML bằng cách sử dụng Thẻ đối tượng HTML
đầu ra Sử dụng thẻ đối tượng Phương pháp 2. Sử dụng iframe Sử dụng thẻ iframe là cách thứ hai để nhúng tệp pdf vào trang web HTML. Trong quá trình phát triển web, các nhà phát triển web sử dụng thẻ iframe để nhúng các tệp ở nhiều định dạng khác nhau và thậm chí các trang web khác trong một trang web. Do khả năng tương thích rộng rãi, thẻ iframe được sử dụng rộng rãi để nhúng pdf. Trình duyệt không hỗ trợ tài liệu PDF hoặc thẻ đối tượng cũng có thể sử dụng thẻ này để nhúng mã HTML pdf ví dụ 2. Ví dụ này mô tả việc nhúng tệp PDF vào HTML bằng iframe HTML
đầu ra Sử dụng thẻ Iframe Phương pháp 3. Sử dụng thẻ nhúng Khi nhúng mã HTML pdf vào trang web, thẻ nhúng không được sử dụng thường xuyên như các thẻ trước đó vì nếu trình duyệt của người dùng không thể xử lý tệp PDF, màn hình sẽ trống. Phương pháp nhúng mã HTML pdf được sử dụng khi không cần cung cấp nội dung dự phòng Làm cách nào để hiển thị PDF trong HTML mà không cần tải xuống?Google Drive . Tải tệp PDF của bạn lên Google Drive. Nhấp vào "Mới" và sau đó chọn "Tải tệp lên" Chia sẻ tài liệu. Nhấp chuột phải vào tài liệu và chọn "Chia sẻ" Thay đổi cài đặt cho tài liệu. . Tạo liên kết công khai cho tài liệu của bạn. . Nhúng tài liệu của bạn vào iframe trên trang web của bạn. . Bản xem trước của Google Drive nhúng PDF Làm cách nào để nhúng PDF vào HTML?Sử dụng thẻ iframe là cách thứ hai để nhúng tệp pdf vào trang web HTML. Trong quá trình phát triển web, các nhà phát triển web sử dụng thẻ iframe để nhúng các tệp ở nhiều định dạng khác nhau và thậm chí các trang web khác trong một trang web. Do khả năng tương thích rộng rãi, thẻ iframe được sử dụng rộng rãi để nhúng pdf.
Làm cách nào để hiển thị PDF trong HTML bằng Javascript?Bước 1 - Tải xuống PDF. Trình xem nhanh js. Bạn có thể bấm vào đây để tải PDF. . Bước 2 - Tích hợp PDF. js Express vào ứng dụng của bạn. Di chuyển tệp PDF đã trích xuất. . Bước 3 - Sử dụng PDF. js Express Viewer API để tùy chỉnh trình xem Làm cách nào để mở tệp PDF trong iframe trong HTML?Nhấp chuột phải vào liên kết trong thuộc tính href và nhấp vào Sao chép địa chỉ liên kết. Tạo khối nội dung Văn bản mới. Nhấp vào biểu tượng Nhúng phương tiện và nhúng mã HTML vào iframe trỏ đến URL PDF mà bạn đã lưu ý ở bước 3. Nhấp vào dấu kiểm để xem PDF được hiển thị trong khung nội tuyến mới được tạo |