What's the purpose (if any) of “[removed]” in event handler tags?

Question

I\'ve been making a concerted effort to improve my javascript skills lately by reading as much javascript code as I can. In doing this I\'ve sometimes seen the javascr

Answer 1

I am no authority in JavaScript, and perhaps more of a dunce than the asker, but AFAIK, the difference is that the javascript: prefix is preferred/required in URI-contexts, where the argument may be as well a traditional HTTP URL as a JavaScript trigger.

So, my intuitive answer would be that, since onChange expects JavaScript, the javascript: prefix is redundant (if not downright erroneous). You can, however, write javascript:myFunction(this) in your address bar, and that function is run. Without the javascript:, your browser would try to interpret myFunction(this) as a URL and tries to fetch the DNS info, browse to that server, etc...

Answer 2

@mercutio

That's ridiculous.

No, it's not ridiculous, javascript: is a pseudo protocol that can indeed only be used as the subject of a link, so he's quite right. Your suggestion is indeed better, but the best way of all is to use unobtrusive javascript techniques to iterate over HTML elements and add behaviour programmatically, as used in libraries like jQuery.

Answer 3

Basically, is there any appreciable difference between: onchange="javascript: myFunction(this)" and onchange="myFunction(this)" ?

Assuming you meant href="javascript: myFunction(this)", yes there is, especially when loading content using the javascript. Using the javascript: pseudo protocol makes the content inaccessible to some humans and all search engines, whereas using a real href and then changing the behaviour of the link using javascript makes the content accessible if javascript is turned off or not available in the particular client.

Answer 4

Flubba:

Use of javascript: in HREF breaks "Open in New Window" and "Open in New Tab" in a Firefox and other browsers.

It isn't "wrong", but if you want to make your site hard to navigate...

Answer 5

It should not be used in event handlers (though most browsers work defensively, and will not punish you). I would also argue that it should not be used in the href attribute of an anchor. If a browser supports javascript, it will use the properly defined event handler. If a browser does not, a javascript: link will appear broken. IMO, it is better to point them to a page explaining that they need to enable javascript to use that functionality, or better yet a non-javascript required version of the functionality. So, something like:

<a href="non-ajax.html" onclick="niftyAjax(); return false;">Ajax me</a>

Edit: Thought of a good reason to use javascript:. Bookmarklets. For instance, this one sends you to google reader to view the rss feeds for a page:

var b=document.body;
if(b&&!document.xmlVersion){
  void(z=document.createElement('script'));
  void(z.src='http://www.google.com/reader/ui/subscribe-bookmarklet.js');
  void(b.appendChild(z));
}else{
  location='http://www.google.com/reader/view/feed/'+encodeURIComponent(location.href)
}

To have a user easily add this Bookmarklet, you would format it like so:

<a href="javascript:var%20b=document.body;if(b&&!document.xmlVersion){void(z=document.createElement('script'));void(z.src='http://www.google.com/reader/ui/subscribe-bookmarklet.js');void(b.appendChild(z));}else{location='http://www.google.com/reader/view/feed/'+encodeURIComponent(location.href)}">Drag this to your bookmarks, or right click and bookmark it!</a>

Answer 6

It should only be used in the href tag.

That's ridiculous.

The accepted way is this:

<a href="/non-js-version/" onclick="someFunction(); return false">Blah</a>

But to answer the OP, there is generally no reason to use javascript: anymore. In fact, you should attach the javascript event from your script, and not inline in the markup. But, that's a purist thing I think :-D