As mentioned by other member of this group, utilizing the elements (id class etc.. ) attributes can and will cause issues when other developers (and especially designers) are also working with the same code.
It is also my personal preference to minimize HTML -> JS markup, html & JS code stays cleaner and you end up with more editable coherent code both in JS and in HTML. IMHO. On Thu, Feb 11, 2010 at 11:18 AM, אריה גלזר <[email protected]> wrote: > i can't see the problem. > Assigning IDs isn't inefficient. We use classes for elements that don't > specifically require a unique identity, or elements that might have multiple > appearances with the same behavior. Another use case is when we want to > generalize a behavior to a wide variety of html structures (for eg when we > write plugins). > In your case, each question-answer is unique, and has an identity on it's > own. Thus, assigning them IDs is the better, and faster solution (using id > selectors is always much faster than using class selectors, *because* they > are unique). When you can safely use IDs, you should. > Also, the IDs allow you to add semantic value to your structure. the best > way to mark the connection between an answer and a question is a DL, but > if your structure won't let you couple them in that fashion (if the lists > must be apart), using coupled IDs is a next best solution. > > all of this is at least the way i see things. > ----------- > אריה גלזר > 052-5348-561 > 5561 > > > On Thu, Feb 11, 2010 at 11:03, cbolson <[email protected]> wrote: > >> > actually, i think the most efficient way to do this is to mark the >> questions >> > and answers with grouped id's: >> > <div id='q14' class = 'question'></div> >> > >> > <div id='a14' class = 'answer'></div> >> > >> > and then you could do: >> > >> > a_id = 'a'+this.get('id').substr(1); >> >> Funnily enough that is the way I "used" to do it - ie assigning >> unique id's to all the questions and answerd (eg) until I got my head >> round arrays and indexes (in Mootools). >> As I understand it this would make for simpler code and less html >> markup (ie no "ids" on all the elements). >> However, you say that using arrays is less efficent in this case so >> now I am not so sure.... time to do a couple of tests... >> >> Chris >> >> >> On 11 feb, 09:43, אריה גלזר <[email protected]> wrote: >> > actually, i think the most efficient way to do this is to mark the >> questions >> > and answers with grouped id's: >> > <div id='q14' class = 'question'></div> >> > >> > <div id='a14' class = 'answer'></div> >> > >> > and then you could do: >> > >> > a_id = 'a'+this.get('id').substr(1); >> > >> > this is much simpler and more efficient than creating an array of all >> > answers and question, and IMO more semantic as well. >> > if you anticipate a question will be clicked multiple times than element >> > storage can be a good solution, but in a q-a scenario i think most times >> > element storage is an overkill. >> > ----------- >> > אריה גלזר >> > 052-5348-561 >> > 5561 >> > >> > On Wed, Feb 10, 2010 at 23:48, cbolson <[email protected]> wrote: >> > > Thanks all for your help :) >> > > I think that it was the indexOf that I was missing in all my various >> > > attempts. >> > >> > > Using getNext(), whilst it works in my example in mooshell, won't >> > > actually work in my actual code as the elements aren't "together". >> > >> > > Cheers, >> > > Chris >> > >> > > On 10 feb, 22:30, Ryan Florence <[email protected]> wrote: >> > > > I'd personally create the arrays and do the indexOf in this >> scenario. >> > >> > > > But there's a chance the actual use case could call for storing the >> > > > answers with the questions then simply retrieving the element using >> > > > el.store and el.retrieve. >> > >> > > > On Feb 10, 2010, at 2:04 PM, אריה גלזר wrote: >> > >> > > > >http://mootools.net/shell/K55zK/3/ >> > > > > this in an event always points to the element. >> > > > > knowing that, here are 2 solutions for this that i can think of: >> > > > > 1. creating a questions array and using indexOf >> > > > > 2. using getNext() to fetch the nearest answer >> > >> > > > > both are shown in the example above. >> > > > > ----------- >> > > > > אריה גלזר >> > > > > 052-5348-561 >> > > > > 5561 >> > >> > > > > On Wed, Feb 10, 2010 at 22:41, cbolson <[email protected]> wrote: >> > > > > Is it possible to get the index of the element (eg) clicked when >> using >> > > > > event delegation? >> > >> > > > > Here is my example code: >> > >> > > > > var comments=$$('.answer').hide(); >> > >> > > > > document.id('faq').addEvent('click:relay(.question)', function(){ >> > > > > // how to get the "index" of the item clicked so that this >> > > > > next line will work? >> > > > > comments[index].show(); >> > > > > }); >> > >> > > > > Code in mooshell: >> > > > >http://mootools.net/shell/kss2C/ >> > >> > > > > Thanks in advance for any suggestions, I am probably missing >> something >> > > > > obvious :( >> > >> > > > > Chris >> > > -- --- "Make everything as simple as possible, but not simpler." - Albert Einstein
