Here’s some decent resources:

• CSS selector and pseudo element support from kimblim.dk. The format on this page is a bit odd, and it lacks granular details on older browsers.
• The browser support charts at dev.l-c-n.com are more detailed but a bit stale.

Here’s a simple example that we use at MasterWish:

mw_b.prototype.checkAll = function()
  {
    $$('.buddy_checkbox').each(function(e){e.checked=true;});
  };

All that example does is iterates over all elements in the DOM that have the class buddy_checkbox and sets their checked value to true. Short and sweet. However, with version 1.5 of Prototype, it could be dog slow at times with more complex selector queries.

I was ecstatic when I found (via Ajaxian) that Sylvain Zimmer has sped up the $$ function quite a bit. I implemented it in the test area of MasterWish and have been very pleased with the results! Here’s what Sylvain has to say on his mod:

Prototype’s current code is quite elegant (as always!) but very slow, so I wrote an add-on that makes this function up to 20 times faster in most usual cases (tested on IE6, Firefox 1.5 and Opera).

[...]

Here are the main ideas of this add-on :

• Forwarding the call to the old $$ if the selector expression is too complicated (currently : if it uses attributes)
• Replacing regular expressions with a simple parser
• Minimizing the number of operations done on each iteration.
• Trying to use getDocumentById() instead of getDocumentByTagName() when possible.
• Avoiding recursive functions with return values.
• Not being afraid of some “old-style” code if it speeds up the execution ;-)

All you need do is get his mod and include it in a script tag after the Prototype inclusion. Simple as that!

Behaviour is a stand-alone event framework. You can use it regardless of whether or not you are using Prototype (or some other Ajax/Javascript library) – which is pretty cool. But…if you are using Prototype there is a lot of code duplication between the two libraries. Luckily, Mir.aculo.us has brought event:Selectors to my attention which is causing me to sing a different tune! Justin Palmer, event:Selector’s creator is crediting Behaviour for the idea, but he’s has what Behaviour has done a few steps further.

• event:Selectors is dependant on Prototype which reduces code duplication.
• It has reduced the layer of complexity of event selecting by one layer of abstraction.
• The framework allows concatenation of CSS elements for event assignment.
• Lastly, its added a loaded event that is triggered when an element loads.

Here’s an example of Behaviour event handlining:

  var rules = {
    '#item li': function(element) {
      Event.observe(element, 'click', function(event) {
        var element = Event.element(element);
        element.setStyle('color': '#c00');
      });
    },

    '#otheritem li': function(element) {
      Event.observe(element, 'click', function(event) {
        var element = Event.element(element);
        element.setStyle('color': '#c00');
      });
    }
  };
  Behaviour.register(rules);

Here’s the equivalent in event:Selectors:

  var Rules = {
    '#item li:click, #otheritem li:click': function(element) {
      element.setStyle('color': '#c00');
    }
  };

EventSelectors.start(Rules);

Simplification makes me happy. I’m a convert.