Highlight, underline, and strikeout text in JavaScript PDF Viewer

16 Oct 20251 minute to read

Use the setAnnotationMode() method to programmatically highlight, underline, and strike through text in a loaded PDF document.

Step 1: Follow the steps in the Get started with JavaScript ES5 PDF Viewer guide to create a sample.

Step 2: Add the following code snippet to highlight, underline, and strikeout text with button click events.

    document.getElementById('setHighlight').addEventListener('click', ()=> {
    viewer.annotation.setAnnotationMode('Highlight');
    });
    document.getElementById('setUnderline').addEventListener('click', ()=> {
    viewer.annotation.setAnnotationMode('Underline');
    });
    document.getElementById('setStrikeout').addEventListener('click', ()=> {
    viewer.annotation.setAnnotationMode('Strikethrough');
    });
    document.getElementById('setNone').addEventListener('click', ()=> {
    viewer.annotation.setAnnotationMode('None');
    });

Find the sample: Highlight, underline, and strikeout text programmatically