i disagree with your assumption that the use of the id attribute is an html->js markup. It is good for semantic purposes. it is also important for accessibility. this specific use case for example, is not about html->js markup. giving questions and answers unique ids that correlate with each other is both good semantics and good for usability (eg allowing anchoring). ----------- אריה גלזר 052-5348-561 5561
On Thu, Feb 11, 2010 at 15:50, Roman Land <[email protected]> wrote: > 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 > >
