Print Specific Element With CSS - jQuery divjs

divjs is a lightweight and easy jQuery element printing plugin which allows the user to print only a selected HTML element with additional CSS styles.

How to use it:

1. To use the element printing plugin, load the main JavaScript file divjs.js after jQuery.

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
        crossorigin="anonymous">
</script>
<script src="divjs/divjs.js"></script>

2. Attach the function printElement to the element you want to print. That's it.

$('.printButton').click(function(){
  $('.element').printElement();
})

3. Customize the title of the document.

$('.element').printElement({
  title: 'Custom Title Here'
});

4. Apply CSS files and styles to the print document.

• extend: all the CSS files and inline styles
• style: only inline styles
• link: only CSS links

$('.element').printElement({
  css: 'extend'
});

5. Apply inline CSS styles to the print document.

$('.element').printElement({
  ecss: 'CSS rules here'
});

6. Apply external CSS files to the print document.

$('.element').printElement({
  lcss: ['example.css', '/path/to/print.css']
});

7. Define an array of elements to hide while printing.

$('.element').printElement({
  keepHide: []
});

8. Set the wrapper for print.

<p id="contacts">All the contacts are going to be print.<p>
<button id="printer">Print</button>

<div>
  <h1>Somethig goes before the printer element</h1>
  <div id="wrapper"></div>
  <p>Footer after the wrapper</p>
</div>

$('#printer').on('click', function(event){
  event.preventDefault();
  $('#contacts').printElement({
    wrapper: {
      wrapper: $('#selector'),
      selector: '#wrapper'
    }
  });
});

Changelog:

v0.1.1 (2019-08-24)

• Clean up.

v0.1.0 (2019-07-17)

• Added wrapper functionality for print

---

This awesome jQuery plugin is developed by zxalif. For more Advanced Usages, please check the demo page or visit the official website.