Hi, It may be a little slower as says Victor. However, you may try to use part of the class to identify a "plugin"class and the other part for identifying the JS class to use. Something like that:
$$("*[class^='plugin']).each(function(e) { var jsClass = e.className.substr(6); if(typeof(window[jsClass])=='function') new (window[jsClass])(e); }); if you have an UL with class pluginTabs, it will make a "new Tabs(e)" on it. Note that the above code is not tested at all. You may need to found a proper way to check if the class actually exists and you may need to use another selector operator than ^= since classes are space separated sets (sorry, I don't have time to check the documentation). On a ground to earth approach, I'd continue doing what you're doing right now. Only difference perhaps is that I'd add to my plugin classes a static method which do the selection and DOM update, so you can give an array of class objects to your DOM init and invoke it. Eric On Aug 23, 10:04 am, Johan Arensman <johanm...@gmail.com> wrote: > Hey guys, > > I'm redesigning a template set for different kind of websites. In the past > quite a lot of 'widgets' have been created in the form of prototype Classes > and almost every widget works the same way: > 1. get all elements with className 'x' > 2. for each element: create a new ClassX > 3. ClassX modifies the element or does something else with it > > for example for a 'Tabs' class this piece of code is in the dom:loaded > event: > $$('ul.tabs').each(function(list) { new Tabs(list); }); > > Now i'm fine with that for now but imagine to duplicate the same behavior > for 8 other usages, so 8 other selections are made and JS code is executed > for them. > > I would like to know if there's any way to optimize the dom:loaded event. > I'm not having any problems right now, it works just fine but I'm afraid > that if more functionality is added that performance will become a problem. > > One of my ideas was to combine the global element selectors into 1 selector > and then apply the correct piece of code by checking if a certain class or > attribute is present on the element like this: > $$('ul.tabs, div.map, input.placeholder, a[rel=external]').each(function > applySomething(e) { > // if element hasClassName('tabs') then apply tabs functionality etc.. > // more checking for classnames and attributes > > }); > > Is this a good idea? Do I gain performance when doing this? Are there other > ways to organize this? > > All input welcome! > > Greetings, > Johan -- You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to prototype-scriptaculous@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.