Hacker News new | past | comments | ask | show | jobs | submit login
Implementing bookmarklets in JavaScript (2ality.com)
65 points by jschuur on June 11, 2011 | hide | past | web | favorite | 14 comments



One of the best things about bookmarklets is that they work on mobiles too.

There's a great collection of bookmarklets at https://www.squarefree.com/bookmarklets/ (Fron the same guy who tracks changes in Firefox's nightly builds: http://www.squarefree.com/burningedge/ )

You can also turn bookmarklets into GreaseMonkey scripts so they can be ran automatically on certain sites (in Firefox): http://www.squarefree.com/2005/05/16/bookmarklets-to-user-sc...


I continue to use a number of (sometimes modified) bookmarklets from squarefree. They are also useful in skirting restrictions in environments where you are "not supposed to install stuff" (but where concerns are not so severe as to prevent execution of Javascript with which you are familiar).

It's also nice to be able to do the same things in an arbitrary set of browsers (for the most part).


Bookmarklets are awesome except they involve more user interaction than should be needed. I feel like almost every time I could use a bookmarklet, a plugin would do more with just as much user initiative.

They also don't have a favicon (or I haven't seen one in FF4) without a user pre-visiting a destination page, so they look unpolished.


Bookmarklets are cross platform across practically any browser and work in mobile devices too. Can't say the same for plugins.

Plus it's easier for some developers to knock out a bookmarklet than a plugin, especially when you can do much of the logic server side, and potentially hook into existing code there.



this is ok- and even shows you how to do async loads. an article targeting more comprehensive bookmarklets might recommend your bookmarklet should only load an external script. additionally, some discussion of postmessage would be cool. you can actually create insanely robust bookmarklets posting messages (and using views) through an iframe(s).


I see you use the (function() {…})(); syntax in your gist, while the linked article uses (function() {…}()); I tried some simple experiment, even passing a param in the outer parens, and both seemed to work the same, and ok. Is one of these "right" and the other one "wrong"?


The former give the following message in http://jslint.com

  Problem at line 1 character 17: Move the invocation into the parens that contain the function.
Crockford seems to prefer the latter but I don't know why.


This is purely a matter of taste. You only need the parens to tell JavaScript that it is a function expression and not a function declaration (a statement). The outer parens make an IIFE look even more block-like to me, which is why I use it. Any other prefix that tells JS that the IIFE is an expression is OK, too. For example:

    +function() { console.log("bla") }();
But: this one converts the result to a number, which you don’t want if you need the result of the IIFE. On the other hand, in places where you need that, there is usually no ambiguity with statements, anyway, and you don’t need any kind of prefix.

    var abc = function() { return "abc" }();


Do you have an example of something cool done with postmessage? I've never seen that term before.


i threw some example code [1] on gist to supplement my comment. i modified it a bit and didn't test it- but it used to work- so probably still good for reference. it's also not very pretty. questions, comments, concerns welcome.

essentially, it gives you two-way communication to your server on any arbitrary domain- that's pretty powerful!

[1] https://gist.github.com/1020251


Instead of polling, you can define event handlers for <script>'s onload and onreadystatechange event to detect when jQuery gets loaded. See Ben Alman's jQuery bookmarklet generator for an example: http://benalman.com/code/test/jquery-run-code-bookmarklet/


yet another collection (great, of course :) - http://linkstore.ru/book/index-en.jsp





Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact

Search: