Skip to content

Instantly share code, notes, and snippets.

@willurd
Last active March 15, 2022 07:11
Show Gist options
  • Save willurd/5702670 to your computer and use it in GitHub Desktop.
Save willurd/5702670 to your computer and use it in GitHub Desktop.
Select All: A bookmarklet for those annoying sites that block you from selecting stuff
javascript:(function()%7Bvar style%3Ddocument.createElement("style")%3Bstyle.type%3D"text/css"%3Bstyle.innerText%3D"* %7B -webkit-user-select: all !important%3B -moz-user-select: all !important%3B user-select: all !important%3B %7D"%3Bvar head%3Ddocument.getElementsByTagName("head")%5B0%5D%3Bhead.appendChild(style)%3B%7D)()%3B

Installation

  1. Create a new bookmark in your favorite browser and name it "Select All"
  2. Copy the code from the bookmarklet_select_all.js file (not source.js, that's just for reference)
  3. Edit your bookmark and paste the bookmarklet_select_all.js code you copied into the URL field
  4. Select ALL THE THINGS!
var style = document.createElement("style");
style.type = "text/css";
style.innerText = "* { -webkit-user-select: all !important; -moz-user-select: all !important; user-select: all !important; }";
var head = document.getElementsByTagName("head")[0];
head.appendChild(style);
@RebeccaWhit3
Copy link

Tried using the bookmarklet just now and wasn't able to select the tab title text above this comment box.

Here's a working alternative:

javascript:(function () {if (document.documentElement.contentEditable === false || document.designMode === "off") {document.body.contentEditable='true';document.designMode='o‌​n';void 0;} else if (document.documentElement.contentEditable === true || document.designMode === "on") {document.body.contentEditable='false';document.designMode='‌​off';void 0;}})();

That will make all the content editable which gurantees text selection on every element without link interferrence.

@hucario
Copy link

hucario commented Feb 5, 2020

Tried using the bookmarklet just now and wasn't able to select the tab title text above this comment box.

Here's a working alternative:

javascript:(function () {if (document.documentElement.contentEditable === false || document.designMode === "off") {document.body.contentEditable='true';document.designMode='o‌​n';void 0;} else if (document.documentElement.contentEditable === true || document.designMode === "on") {document.body.contentEditable='false';document.designMode='‌​off';void 0;}})();

That will make all the content editable which gurantees text selection on every element without link interferrence.

That is a terrible alternative. Making everything content editable has many, many side effects that you aren't considering.
Instead, try just setting CSS on literally every element that needs it to allow selection:
javascript:(function() { var x = document.querySelectorAll('*'); for (var i = 0; i < x.length; i++) { if (getComputedStyle(x[i]).userSelect!=="all") {x[i].style.userSelect="all";} } })();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment