How to copy to the clipboard in JavaScript

Copy to the clipboard refers to the process of temporarily storing a piece of information, usually text, in a special area of your computer's memory called the clipboard. This copied information can then be pasted into another application or document.

In this tutorial, we will learn how to copy to the clipboard in JavaScript? To copy text to the clipboard in JavaScript we need to use document.queryCommandSupported("copy") or document.execCommand("copy") if the first method is not supported by the browser.

Note that document.execCommand('copy') is deprecated but some browsers still support that command.

function copyToClipboard(text) {
    if (window.clipboardData && window.clipboardData.setData) {
        // IE specific code path to prevent textarea being shown while dialog is visible.
        return clipboardData.setData("Text", text); 

    } else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
        var textarea = document.createElement("textarea");
        textarea.textContent = text; = "fixed";  // Prevent scrolling to bottom of page in MS Edge.
        try {
            return document.execCommand("copy");  // Security exception may be thrown by some browsers.
        } catch (ex) {
            console.warn("Copy to clipboard failed.", ex);
            return false;
        } finally {

document.querySelector("#copy").onclick = function() {
    var result = copyToClipboard(new Date().toString());
    console.log("copied?", result);
<button id="copy">Copy to clipboard</button>

The copyToClipboard function copies a string to the clipboard. This function must be called from within an event handler for example button click.

The function may return false if it failed.

In this tuotral, we presented how to copy a string to the clipboard in JavaScript.


How to copy to the clipboard in JavaScript
1.50 GEEK