A few months ago I built a bookmarklet for the app I’m currently developing for the government. A bookmarklet is essentially JavaScript embedded in a link and placed in your browser’s bookmarks folder or toolbar.

The bookmarklet I build is meant to enable analysts to clip content from the web and add it to a “notebook.” These notebooks are used by analysts to organize information and collaborate. We are also leveraging a triple store backend to connect similar keywords and make assertions which will ultimately allow these analysts to find more relevant information and catch the bad guy. But enough of what I do, let’s get back to the bookmarklet stuff.

So I had originally had all the code inside the link. The real problem with this is that new versions require an “install” and that is not what the web was about. So after some thinking I realized that I could just embed a file in the bookmarklet, so updates can be made seamlessly (or once the file cache expires).

While I was going through this process I came across some strange behavior when trying to attach the script element to the BODY. Another caveat to this approach was that if some arcaic website is still using FRAMESET there actually won’t be a BODY tag. More of a reason to attach it to HEAD.

Code is below:

javascript:function loadScript(scriptURL) {
  var scriptElem = document.createElement('SCRIPT');
  scriptElem.setAttribute('language', 'JavaScript');
  scriptElem.setAttribute('src', scriptURL);
  document.getElementsByTagName('head')[0].appendChild(scriptElem);
}
loadScript('http://localhost/bookmarklet.js');