Jak zapisać stronę HTML jako pdf za pomocą JavaScript

Podczas tworzenia stron internetowych projektanci stron internetowych muszą podać użytkownikom opcję zapisania formularza lub strony jako PDF. Na przykład strony internetowe oferujące rekrutacje uczelni i uniwersytetów korzystają z tej opcji, prosząc użytkowników o wypełnienie aplikacji online, pobieranie jej jako pliku PDF, a następnie przesłania na kampusie.

Ten post opisuje metodę zapisania strony HTML jako PDF.

Jak zapisać stronę HTML jako pdf za pomocą JavaScript?

Aby zapisać stronę HTML jako PDF, użyj bibliotek JavaScript ”jspdf" z "html2canvas". JSPDF to biblioteka typu open source oparta na JavaScript do tworzenia dokumentów PDF. Oferuje kilka możliwości tworzenia plików PDF o określonych cechach. Zawiera różnorodne wtyczki do obsługi różnych metod tworzenia PDF, a HTML2CANVAS to biblioteka JavaScript, która generuje widok z danych na stronie.

Przykład

W pliku HTML najpierw utworzymy stronę internetową posiadającą następującą tabelę:

ID	Nazwa	Przeznaczenie	Data dołączenia	Wiek
1	Jan	Hr	16 May2000	26
2	Rohnda	Menedżer	23 czerwca2005	24
3	Stephen	Księgowy	20 września 2008 r	26

Teraz stwórz „Wydrukować”Przycisk, który zadzwoni do„wydrukować()”Metoda w zdarzeniu kliknięcia, aby przekonwertować stronę HTML na plik PDF:

Wydrukować

Do konwersji strony HTML na PDF dodaj „jspdf" I "html2canvas„Biblioteki do znacznika w pliku HTML. Dla "jspdf„Biblioteka, użyj poniższego kodu:

Dla "html2canvas„Biblioteka, użyj poniższego linku:

W pliku JavaScript lub znaczniku dodaj następujący kod:

okno.jspdf = okno.jspdf.jspdf;
var docpdf = new jspdf ();
funkcja print ()
var elementhtml = dokument.querySelelect („#printTable”);
DOCPDF.html (elementhtml,
Callback: funkcja (docpdf)
DOCPDF.Zapisz („HTML Linuxhint Strona internetowa.pdf ');
,
X: 15,
Y: 15,
Szerokość: 170,
WIDWIDTH: 650
);

W powyższym kodzie:

• Po pierwsze, JavaScript musi załadować klasę JSPDF i użyć obiektu JSPDF.
• Następnie zdefiniuj „wydrukować()„Funkcja, która uruchomi kliknięcie przycisku.
• Używając "QuerySelelect ()„Metoda otrzymamy zawartość HTML z określonego elementu według identyfikatora.
• Utwórz plik PDF, przekształcając zawartość HTML wybranego obszaru witryny.
• Następnie pobierz i zapisz zawartość HTML jako plik PDF.

Wyjście wskazuje, że strona internetowa HTML jest pomyślnie przekonwertowana na plik PDF:

Chodzi o zapisywanie strony internetowej HTML jako PDF w JavaScript.

Wniosek

Aby zapisać stronę internetową HTML jako PDF, użyj JavaScript „jspdf„Biblioteka z„html2canvas" biblioteka. JSPDF to biblioteka typu open source używana do konwersji strony HTML na PDF, podczas gdy HTML2CANVAS jest używany do tworzenia widoku na podstawie danych strony. W tym poście opisano metodę zapisania strony HTML jako PDF.