jQuery is a true prototype killer

Posted by Felix Geisendörfer, on Aug 24, 2006 - in JavaScript & jQuery

Deprecated post

The authors of this post have marked it as deprecated. This means the information displayed is most likely outdated, inaccurate, boring or a combination of all three.

Policy: We never delete deprecated posts, but they are not listed in our categories or show up in the search anymore.

Comments: You can continue to leave comments on this post, but please consult Google or our search first if you want to get an answer ; ).

Update: jQuery 1.0 has just been released. Go and check it out!

After spending (too) much time on learning how to use prototype, I recently gave jQuery a serious try. Saying that I'm amazed is maybe an understatement. I think I'll never go back.

Just take look at my code for opening external links (with a rel attribute = 'external') in prototype:







[javascript]/**
* This attaches an onClick event to all anchors containing rel="external" on the site
**/
this.Behaviors.externalLink = function()
{
var anchors = document.getElementsByTagName('a');
for (var i=0; i {
var anchor = anchors[i];
var relAttribute = String(anchor.getAttribute('rel'));
if (relAttribute.toLowerCase().match('external'))
{
Event.observe(anchor, 'click', function(event){Lugsteinhof.Behaviors.externalLink.click(event);});
}
}
}

/**
* This is the behavior for externalLinks that are clicked (open them in a new window).
**/
this.Behaviors.externalLink.click = function(event)
{
Event.stop(event);
var element = Event.findElement(event, 'a');
window.open(element.getAttribute('href'));
}
[/javascript]

And now jQuery:
[javascript]/**
* This attaches an onClick event to all anchors containing rel="external" on the site
**/
this.Behaviors.externalLink = function()
{
$("a[@rel='external']").click(function(){window.open(this.href); return false;});
}[/javascript]

If you think that's cool, go and checkout their website and refactor your site to use jQuery like technorati already did.

--Felix Geisendörfer aka the_undefined