Behaviour: Using CSS selectors to apply Javascript behaviours
I love reading this:
After all the work of WASP and others to promote clean markup, valid pages and graceful degradataion via css - it sucks that we're going back to tag soup days by throwing javascript tags into our html.
The better way to do javascript is to do it unobtrusively. PPK and Simon Willison have been recommending this approach for ages. And it's definitely the way to go. The only problem is that it's a bit of a pain in the ass.
That's why I came up with Behaviour - my solution to unobtrusive javascript behaviours.
The idea behind this Javascript library is great -- it's similar to what I argued for in Why JSP Sucks So Hard. As I mentioned in my post on Ruby on Rails, I still find it grating when I see so much non-HTML code in an HTML page; and the CSS marker system seems like a great way to hook code and markup together. Cheers to the Behaviour folks.
Of course, there are still plenty of people on the other side of this argument. Maybe it will be the long-standing religious issue of HTML dynamism. I wish some general solution, like the TinyTemplateEngine in Wheat, or even something like ClearSilver, would emerge as a leader so that we could really hear that language-neutral templates are producing clear wins. That story doesn't get told very often, which is too bad. A monstrous amount of money, in my opinion, is being wasted in the Web economy with pages written to any one, transient template engine.
tags:
| comments: 3
| Sphere It
submit: 
0 TrackBacks
TrackBack URL for this entry: http://blogs.oreilly.com/cgi-bin/mt/mt-t.cgi/4116
Comments: 3
Tristan, one server-side implementation -- made for Ruby on Rails -- is Amrita2. There are two similar projects mentioned in my earlier Rails post (linked to above).
This is a little bit late of a comment, but just in case someone reads it.
One thing that have come up in discussions about behaviour is that so many templating systems don't directly support it.
The problem isnt the templating system, its the way you think. This is similar to learning XHTML/CSS for the first time after building websites out of tables for your entire career.
Build your HTML template like you normally would without ajax/javascript hooks and make it 100% operational. Just remember to make sure you properly categorize the HTML elements with classes and/or ID's (just like your CSS), and then use the behavious style to link the javascript where nessissary.
Like when you migrate from old-HTML to XHTML/CSS, your overall code size will be quite a bit smaller, easier to read, and MUCH less redundant.
Also, with a little planning, clever coding, a browser detection script, and about 10 minutes you can easily set up behaviour to only be loaded on browser that support your javascript hooks. If done right, your web page will operate with full JS/Ajax on newer browsers, but will still work perfectly (and without error) on old browsers.
Although it requires a learning curve, overall once you get the hang of it you can easily be more productive and produce cleaner more portable code.
Post A Comment:
STAY CONNECTED
RECENT COMMENTS
- NeoMike on Behaviour: Using CSS selectors to apply Javascript behaviours: This is a little bit la...
- Marc Hedlund on Behaviour: Using CSS selectors to apply Javascript behaviours: Tristan, one server-sid...
- Tristan on Behaviour: Using CSS selectors to apply Javascript behaviours: How would this method w...
RADAR TOPICS
Tristan [06.25.05 08:00 PM]
How would this method work with helper functions in the server side language? Seems a bit tricky. For example, most of the javascript in rails apps is dynamically generated from very simple helper functions. link_to() creates a nice link with javascript onclick. I'd really hate to also have an assign_link_to_onclick_action() at the top.