Create Bookmarklet (browser bookmark that executes Javsacript) to copy a given text to Clipboard

copy-to-clipboard-bookmarklet.md

Copy-to-clipboard Bookmarklet

Create Bookmarklet (browser bookmark that executes Javsacript) to copy a given text to Clipboard.

This is the base javascript:

(function (text) {
  var node = document.createElement('textarea')
  var selection = document.getSelection()

  node.textContent = text
  document.body.appendChild(node)

  selection.removeAllRanges()
  node.select()
  document.execCommand('copy')

  selection.removeAllRanges()
  document.body.removeChild(node)
})('Text To Copy')

Minify it (you can use UglifyJS or any other) to get something like this:

!function(a){var b=document.createElement("textarea"),c=document.getSelection();b.textContent=a,document.body.appendChild(b),c.removeAllRanges(),b.select(),document.execCommand("copy"),c.removeAllRanges(),document.body.removeChild(b)}("Text To Copy");

Prefix it with javascript::

javascript:!function(a){var b=document.createElement("textarea"),c=document.getSelection();b.textContent=a,document.body.appendChild(b),c.removeAllRanges(),b.select(),document.execCommand("copy"),c.removeAllRanges(),document.body.removeChild(b)}("Text To Copy");

Then add it as a new bookmark, in the URL field:

More applications

You can do stuff like a "Copy page title" bookmarklet by simply passing document.title instead of the fixed string:

javascript:!function(a){var b=document.createElement("textarea"),c=document.getSelection();b.textContent=a,document.body.appendChild(b),c.removeAllRanges(),b.select(),document.execCommand("copy"),c.removeAllRanges(),document.body.removeChild(b)}(document.title);

@cipher0x30: thank you so very much!!! This worked perfectly for me - until I renamed the bookmark. Now I can't get it to work again...

I also experienced that, but I found a little trick when it happens, although it also needs a few clicks.

Before trying to copy-paste, open developer console or inspect element and then click the bookmarklet (copy-paste).

Worked for me, hope it works for you as well.

Upon creating the bookmark, it only works once for me. Subsequent clicks show the following message in the console:
document.execCommand('cut'/'copy') wurde abgelehnt, weil es nicht von innerhalb einer kurz dauernden benutzergenerierten Ereignisbehandlung aufgerufen wurde.
There might be solutions down the rabbit hole here: https://stackoverflow.com/q/41094318.
All I want is an easy way to copy my rather long emailadress to the clipboard, preferably with a single click on a bookmark...

Instead of create a temporary element (and erase current user's selection), use directly the copy event:

let copyListener = event => {
	document.removeEventListener("copy", copyListener, true);
	event.preventDefault();
	let clipboardData = event.clipboardData;
	clipboardData.clearData();
	clipboardData.setData("text/plain", "Hello, world!");
	clipboardData.setData("text/html", "<b>Hello, world!</b>");
};
document.addEventListener("copy", copyListener, true);
document.execCommand("copy");

This works really well, except when I use it twice I get the following console error:
Uncaught SyntaxError: Identifier 'copyListener' has already been declared

What do you think is causing this?

Solved: Change let copyListener = to var copyListener =. Let variables cannot be redeclared!

Thanks you so much, @kylesnowschwartz! This is the final version that works for me:

javascript:
var copyListener = event => {
	document.removeEventListener("copy", copyListener, true);
	event.preventDefault();
	let clipboardData = event.clipboardData;
	clipboardData.clearData();
	clipboardData.setData("text/plain", "TEXTIWANTTOCOPYTOCLIPBOARD");
};
document.addEventListener("copy", copyListener, true);
document.execCommand("copy");
document.body.lastElementChild.setAttribute("hidden","hidden");
document.preventDefault;

none of this is working. How do I make it work on Chromebook?

The code works in Chrome but only when on an actual webpage. It's not working for empty chrome tabs or while viewing extensions (which is my personal use case).

This seems to work as well but the same problem:

javascript:(function(){
  var data = "Your data to be copied";
  var tempInput = document.createElement("input");
  tempInput.value = data;
  document.body.appendChild(tempInput);
  tempInput.select();
  document.execCommand("copy");
  document.body.removeChild(tempInput);
})();

Hey atjackiejohns
I think what you're experiencing is the general exclusions that Google applies to Chrome - extensions and scripts aren't allowed on certain pages by Google - this includes the chrome special tabs, some aspects of the chrome store - and I think also on other extensions too, but I'm not certain on that