Hello developers, In this post we will discuss about jsPDF .fromHTML() Tutorial to Convert HTML Div Paragraphs to PDF Document in Javascript For Beginners.
What is jsPDF?
JsPDF is an open-source javascript library used to generate PDF files from input text. It also offers some PDF creation options with some custom features like password protection.
PDF (Portable Document Format) is also called a read-only document which is static and cannot be edited by anyone unless the rights are granted, remember that data security is the most important thing on this internet.
Every company wants to protect its data. They want to share their data, but have security in place so that only the right person can access it. But how?
There is a PDF here. PDF is the only way to share data in a file that can be secured with a username and password.
<!DOCTYPE html>
<html>
<head>
<title> Reading </title>
<meta charset="utf-8" />
</head>
<body id="target">
<div id="page-content">
<h1 style="color: #fbceb5; background-color: 2d334a;
background: linear-gradient(to left, #6e5773 , #d8b5b5);">
The Magic Of Reading </h1>
<p>
Reading is probably one of the most beneficial and feasible activities that a man can do.
It is through reading that a person is going to be able to discover new ideas, concepts, places, and people.
Some people even describe reading as a journey that starts as the opening of a page, and finishes as the
last page is turned.
The reason why reading is so important is because reading is relaxing to our mind and soul; it is a way for
children to reach out to the world,
and it improves our thinking process.
</p>
<br />
</div>
<div style="text-align: center;">
<button id="click-button" style="background-color:rosybrown; border-color: rosybrown; height: 35px;"> Convert to
PDF </button>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
<script>
$(document).ready(function () {
var specialElementHandlers = {
"#editor": function (element, rendrer) {
return true;
}
};
$('#click-button').click(function () {
var myDocument = new jsPDF();
myDocument.fromHTML($("#target").html(), 15, 15, {
"width": 170,
"elementHandlers": specialElementHandlers
});
myDocument.save("File.pdf");
});
});
</script>
</html>Output:
Conclusion
Hope that you have liked the given information related to jsPDF fromHTML() Tutorial to Convert HTML Div Paragraphs to PDF in Js.
Related Posts: