Like many tools and syntaxes, I discovered bookmarklets while trying to solve a problem. Reddit user MobilePanda1 made this post: I built a website that will be won by the first person to count to a million. Scripting is allowed. It was the weekend and I was sitting around so I figured I would take a shot at it. Instinctually, I tried to open dev tool so I could play around in the console. Nothing happened. They locked down the console? Yep. Sure did. And when I used other means to force the dev tools to open, the tab would close. They had forbidden the obvious.
I eventually found ways to keep dev tools open for a moment before it would kick me out, but I was still getting kicked out. In my search for a solution to this, I discovered the bookmarklet. And they have been around forever so I have no clue how I missed them. It’s basically an anonymous function you add to the URL field of a bookmark and when you click the bookmark the function runs. The syntax is simple enough, too:
javascript:(function() {
// Your code goes here
})();Since discovering, I have already used it to improve my productivity by creating scripts I can use to do or speed up tasks. For example, I created function that would scan the page content for “hidden” links (like an a-tag around a non-breaking space) and on a hit, it would put the URL in the tag and style it so that it is large and red – very easy to spot in the page content. Then I was able to remove those unwanted links from the content. But there’s nothing stopping you from going further and creating a whole ass regex search for your browser, or your own accessibility script, or whatever you can code up.
One important note, though, is the bookmarklet will be formatted to go on one line. So, if your code has comments then it will break. I suggest removing all comments and minifying before saving your bookmarklet.
Have fun!