Thursday, February 23, 2012

Bookmarklets

Bookmarklets are a useful way of executing your own javascript on a third party web page. It opens up a method of doing some neat things on a web page with the ease of a single click.

They use the capability of a browser to identify and execute URIs with javascript: prefix, just like they do with http:, file: etc. Once a browser identifies a bookmarklet by detecting ‘javascript:’ it will treat the rest of the string as a javascript and execute it within the context of the current page.

Some of the bookmarklets that I use often are; (Just drag these links to your bookmark bar)
1. Google Bookmark
2. Wiki Search
3. Map This
4. Quick Navigation

The bookmarklet statements (javascript) will have access to the DOM of the current web page and once executed, by default will redirect the current page to a new page and display the return value of the set of statements. Due to this reason, bookmarklets will generally swallow the return statement or just return void. But the best method is to adhere to the following pattern of wrapping the functionality in to a self executing javascript function.

 

javascript:
(function(){
  ...
  your js/bookmarklet statments
})
()


Since a bookmarklet is nothing but a URI in the eyes of a browser, all your javascript statements has to end up as one single line. So authoring a bookmarklet can be tedious in your standard editor. The best tool I’ve found to manage this is the online bookmarklet authoring tool here. The same site has some valuable advice regarding writing your own bookmarklets over here.



I found bookmarklets really useful in auto-filling some mundane forms I have to fill in within our enterprise environment. An excruciating 15 minutes of utter uselessness has turn in to a pleasurable few seconds thanks to it.
Post a Comment