JSFiddle - React, Tailwind, and code Playground

by Vishnuprasad ps

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<div id="content" style="background-color: white;">
  <h3>Hello, this is a H3 tag</h3><h3>Hello, this is a H3 tag</h3>
  <p>a pararaph</p>
  <img width=100 src="https://via.placeholder.com/350x150">
  <p>
    Text after img
  </p>
</div>
<button id="cmd">generate PDF</button>

CSS

body {
  font-family:sans-serif;
}
h3 {
  float:left;
  padding:15px;
  background:#eee;
  border:1px solid #333;
}

JavaScript

$('#cmd').click(function() {
  var options = {
  };
  var pdf = new jsPDF('p', 'pt', 'a4');
  pdf.addHTML($("#content"), 15, 15, options, function() {
    pdf.save('pageContent.pdf');
  });
});