Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Create Bookmarklet (browser bookmark that executes Javsacript) to copy a given text to Clipboard

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:

Chrome Example

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);
@keemor

This comment has been minimized.

Copy link

commented Jan 10, 2017

Works in Chrome, but Firefox 50.1 says:
document.execCommand('cut'/'copy') was denied because it was not called from inside a short running user-generated event handler.

@mems

This comment has been minimized.

Copy link

commented Mar 11, 2017

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");
@lettucehead

This comment has been minimized.

Copy link

commented Apr 16, 2017

This rocks!!

@Luiz-N

This comment has been minimized.

Copy link

commented Sep 7, 2017

Thanks for this clever hack! Just to add that I needed to add semicolons after each statement to get it working in chrome

@Gundark

This comment has been minimized.

Copy link

commented Oct 6, 2017

Very useful, thanks very much. I've referenced this in answer to relevant questions on Stack Overflow. :-)

@brry

This comment has been minimized.

Copy link

commented Oct 7, 2017

Works in IE 11.0.96, but not in firefox 55.0.2 or 56.0 (tested on two computers). It seems like nothing happens, the old clipboard is still there. If I open the bookmarklet in a new tab, it displays "true". Any idea what to change?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.