Come salvare la pagina HTML come PDF usando JavaScript
Durante la creazione di siti Web, i web designer devono fornire all'opzione per gli utenti di salvare un modulo o una pagina come PDF. Ad esempio, i siti Web che offrono ammissioni universitari e universitari utilizzano questa opzione, chiedendo agli utenti di compilare l'applicazione online, scaricarla come file PDF e quindi inviarla nel campus.
Questo post descriverà il metodo per salvare la pagina HTML come PDF.
Come salvare la pagina HTML come PDF usando JavaScript?
Per salvare una pagina HTML come PDF, utilizzare le librerie JavaScript "jspdf" con "html2canvas". JSPDF è una libreria open source basata su JavaScript per la creazione di documenti PDF. Offre diverse possibilità per la creazione di file PDF con caratteristiche specifiche. Include una varietà di plugin per supportare vari metodi di creazione di PDF, mentre HTML2CANVAS è una libreria JavaScript che genera una vista dai dati sulla pagina.
Esempio
In un file HTML, in primo luogo, creeremo una pagina Web con la seguente tabella:
| Id | Nome | Designazione | Data di iscrizione | Età |
|---|---|---|---|---|
| 1 | John | Hr | 16 maggio2000 | 26 |
| 2 | Rohnda | Manager | 23 giugno2005 | 24 |
| 3 | Stefano | Contabile | 20 settembre2008 | 26 |
Ora, crea un "StampaPulsante "che chiamerà"stampa()"Metodo sull'evento clicca per convertire la pagina HTML in un file PDF:
Per convertire la pagina HTML in PDF, aggiungi il “jspdf" E "html2canvas"Libraries al tag nel file HTML. Per il "jspdf"Libreria, usa il codice seguente:
Per il "html2canvas"Libreria, usa il link seguente:
Nel file JavaScript o nel tag, aggiungi il seguente codice:
finestra.jspdf = finestra.jspdf.JSPDF;var docpdf = new jspdf ();
funzione print ()
var elementhtml = documento.QuerySelector ("#printTable");
DOCPDF.html (elementHtml,
callback: function (docpdf)
DOCPDF.Salva ('Pagina Web HTML Linuxhint.PDF');
,
X: 15,
Y: 15,
Larghezza: 170,
Windowwidth: 650
);
Nel codice sopra:
- Innanzitutto, JavaScript deve caricare la classe JSPDF e utilizzare l'oggetto JSPDF.
- Quindi, definisci un "stampa()"Funzione che attiverà il clic del pulsante.
- Usando il "QuerySelector ()"Metodo, otterremo il contenuto HTML da un elemento specificato per ID.
- Crea un file PDF convertendo il contenuto HTML dell'area selezionata del sito Web.
- Quindi, scarica e salva il contenuto HTML come file PDF.
L'output indica che la pagina Web HTML viene convertita correttamente in un file PDF:
Si tratta di salvare la pagina Web HTML come PDF in JavaScript.
Conclusione
Per salvare la pagina Web HTML come PDF, utilizzare JavaScript "jspdfBiblioteca con il "html2canvas" biblioteca. JSPDF è una libreria open source utilizzata per convertire la pagina HTML in PDF, mentre HTML2CANVAS viene utilizzata per la creazione di una vista in base ai dati della pagina. Questo post ha descritto il metodo per salvare la pagina HTML come PDF.