{"id":722,"date":"2007-07-06T22:59:25","date_gmt":"2007-07-07T06:59:25","guid":{"rendered":"http:\/\/www.wiredatom.com\/blog\/2007\/07\/06\/unobtrusive-javascripting\/"},"modified":"2007-07-07T11:42:44","modified_gmt":"2007-07-07T19:42:44","slug":"unobtrusive-javascripting","status":"publish","type":"post","link":"https:\/\/www.wiredatom.com\/blog\/2007\/07\/06\/unobtrusive-javascripting\/","title":{"rendered":"Unobtrusive JavaScripting"},"content":{"rendered":"

Recently I’ve been looking into ways to make my code more maintainable after having to support an old site I did and some Actionscript code from someone else. One of the things I found and REALLY liked was the idea of using Javascripts in an “unobtrusive<\/a>” manner. Basically all it means is to take out those Javascript event calls like<\/p>\n

1
<\/div><\/td>
onClick<\/div><\/td><\/tr><\/tbody><\/table><\/div>\n

,<\/p>\n

1
<\/div><\/td>
onMouseOver<\/div><\/td><\/tr><\/tbody><\/table><\/div>\n

and such from the presentation layer (CSS style sheets and HTML tags), and use other means to achieve the same effects.<\/p>\n

What I’ve found useful and have been using ever since are these classes:<\/p>\n

\n1. Prototype<\/a>
\n2. script.aculo.us<\/a>
\n3. Behaviour<\/a>\n<\/p><\/blockquote>\n

There are tons of extensions and subclasses written for them, making them super useful when you want something done quickly and effectively. I especially like Behaviour for its simplicity and the ability it affords me to completely separate Javascripting from tangling with my HTML codes (hard coded, dynamically generated or otherwise).<\/p>\n

There are other useful ones such as jQuery<\/a> and moo.fx<\/a>, but I’ve been pretty happy with those other three core packages so far. <\/p>\n

Incidentally, Apple’s revamped site also has a lot of new Javascript-driven effects that are pretty interesting to look at and experiment with. Another really clean and simple site I like is Panic’s Coda<\/a> product site. Really very effective use of Javascripts in presentation.<\/p>\n

There’s always so much to learn with so little time… What to do!!<\/p>\n","protected":false},"excerpt":{"rendered":"

Recently I’ve been looking into ways to make my code more maintainable after having to support an old site I did and some Actionscript code from someone else. One of the things I found and REALLY liked was the idea of using Javascripts in an “unobtrusive” manner. Basically all it means is to take out … Continue reading “Unobtrusive JavaScripting”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[21,10],"tags":[],"class_list":["post-722","post","type-post","status-publish","format-standard","hentry","category-coding","category-geek-stuff"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p54IqZ-bE","_links":{"self":[{"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/posts\/722","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/comments?post=722"}],"version-history":[{"count":0,"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/posts\/722\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/media?parent=722"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/categories?post=722"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wiredatom.com\/blog\/wp-json\/wp\/v2\/tags?post=722"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}