Friday, July 30, 2010

Use JavaScript comment-urls instead of the traditional void(0) method

The longstanding compromise, between reducing inline JavaScript and preserving accessibility, has been to use "javascript:void(0)" in link hrefs and form-element actions. These elements and attributes are the hardened fall-back to DOM Level 2 events, and (unlike myself) many believe something must be there. Well the ubiquitous technique has a successor that is new to me. I'm no more excited about it's purpose, but glad something new has come along.

Unlike most of what I post here, I did not learn this technique but rather observed it, while using Instead of invoking the method which returns nothing (actually, void() returns "undefined"), they instead use JavaScript that does nothing, with a single-line comment. These JavScript comment-urls work in all web browser, supporting JavaScript version 1.0.

Wherever you use the JavaScript void() method, like so:
    <a href="javascript:void(0)">Do Something</a>

Simply use a JavaScript comment, like so:
    <a href="javascript://">Do Something</a>

I prefer this approach because it's a shorter string - taking up less bandwidth, uses fewer threads/cycles, and is poetic in it's simplicity. If you want JavaScript to take over yet do nothing, I couldn't imagine anything less than a comment. Again, I do not generally advocate JavaScript-urls, but feel if you must use them, use this one.

Do share if you've found a JavaScript capable web browser that does not support this technique. Or, let me know why you (too) think JavaScript-urls should not be employed... It's an opinion of mine (which I'd like to avoid on this blog), but I might post about that later.


No comments:

Post a Comment