How can I copy text to the clipboard with JavaScript?

All Youtube tutorials seem to teach the now deprecated Document.execCommand(). I had a go trying it as the example goes on this MDN website. Maybe there’s another way?

navigator.permissions.query({name: "clipboard-write"}).then(result => {
  if (result.state == "granted" || result.state == "prompt") {
    /* write to the clipboard now */
    console.log("safe");
  }
});

let button = document.querySelector('button');

button.addEventListener('click', (e) => {
    let data = "red";
    navigator.clipboard.writeText(data).then(function() {
    /* success */
      console.log("success", data);
    }, function() {
      console.log("fail")
    /* failure */
    });
});
<button>Click me</button>

18 thoughts on “How can I copy text to the clipboard with JavaScript?”

Leave a Comment