Path: csiph.com!3.eu.feeder.erje.net!feeder.erje.net!news.albasani.net!.POSTED!not-for-mail From: Thomas 'PointedEars' Lahn Newsgroups: comp.lang.javascript Subject: Re: Getting the index of a clicked element Date: Sat, 08 Jun 2019 12:13:02 +0200 Organization: PointedEars Software (PES) Lines: 98 Message-ID: <5498390.lOV4Wx5bFT@PointedEars.de> References:

Reply-To: Thomas 'PointedEars' Lahn Mime-Version: 1.0 Content-Type: text/plain; charset="UTF-8" Content-Transfer-Encoding: 8Bit X-Trace: news.albasani.net 6mjRDMz1keXipcoTlXTyP1a23oUtbAy8Pm5dSeJD4PSUdx0t12qPo6WyrZwptg9N0bkjZ7kZ6VANpCveUl/1cJjda2JpeMuG7m524gdHI7myCoMlP+OJiV4DiHep6+IK NNTP-Posting-Date: Sat, 8 Jun 2019 10:13:07 +0000 (UTC) Injection-Info: news.albasani.net; logging-data="2m3kQojkQkJ6qVVrX/Y8OxRa1fIy9hoLUzyF5zR7zYjKhpDrtqMCwOGErs3DnpljTsv4hazQXSSjWOnp5MDKlSVH27nk7GFMRBGZ2Ox6E67jTHl7XkYiSuy5QiuvOE7Y"; mail-complaints-to="abuse@albasani.net" User-Agent: KNode/4.14.10 Face: iVBORw0KGgoAAAANSUhEUgAAADAAAAAwBAMAAAClLOS0AAAAGFBMVEXTxa4RFk5dUWANED8PFEfy7+MGBiW+n3ZNF/QuAAACaElEQVQ4jVXUwVOcMBQG8Dc7Rc4PUntdWV2uxjDpGaGeozOp1woar4jd5t/v9wLstMwsA/ntlxdCAgUc1hjTc9/JCZfGoo3wG3HdmdAWrIJRHe7GM/TmpY5VFefuVcAkkPbLIaN8rmPmjloyZxgyR3GuJ4K0AGtJ2htz8o7yqikm759fldQXaMpbDzjKAG+8v+AugVTOPO5DOjLvGtUYQwh0CPjnVMyGd+8/GfUB5nLKJDD2aLDh5HYyMDJGDwQIo2ZmZcKbowNmAdB/AzyFhrmF2MHRb0QJJfaAnwGB6orZhoykLzJtGwF/xpYxI1dswomiUj3gTuAIqCn/4C7cULwGNBtwMTk3Y4LfKB5YUaOKBKYtpplm7u0vip8tU1NWWyI/7XdcSuIDoMt6rVHMWT0DbjHPGqDqZVSa6zleLcUTcIKLoMv3ueJluALtAo9B302zPPlrtiVScRdCjXvVh3e3JpYa/jjkuC9N+LrBMlz/eAN4eQijX2EdLo6c5tGGHwLyHFtXk89dDGHwCVhG9T0S/j55AhRZgkMCmUQXJ49TnS1wnQDvw0eAh9ICeMmEFbCnPMFzjAvsWoEWEFdYEx+S0MoUZ1gT1wId8+AF3Bl2OoEu906AUHx5VLw/gXYg/x84loOah/2UYNrgiwSwGO7RfUzVBbx/kgpckumGOi6QirtD6gkLTitbnxNol47S2jVc2vsN5kPqaAHT8uUdAJM4v/DanjYOwmUjWznGfwB7sGtAtor5BgofDuzaRj4kSQAqDakTsKORa3Q3xKi3gE1fhl71KRMqrdZ2AWNNg/YOhQyrVBnb+i+nEg4bsDA+egAAAABJRU5ErkJggg== X-Face: %i>XG-yXR'\"2P/C_aO%~;2o~?g0pPKmbOw^=NT`tprDEf++D.m7"}HW6.#=U:?2GGctkL,f89@H46O$ASoW&?s}.k+&. On 08/06/2019 06:57, JJ wrote: >> On Fri, 7 Jun 2019 17:35:40 +0100, James Harris wrote: >>>

Why?

>>>

Because

>>> >>>

When?

>>>

Soon

>> >> With that HTML structure, you can setup the click event handler like >> below. >> >> addEventListener("click", e => { addEventListener must be called as method of the event target, not the global object. >> e = e.target; >> if (e.classList.contains("question")) { This is actually insufficient, see below. >> e = e.nextElementSibling.style; >> e.display = e.display ? "" : "block"; Looking for siblings with script code and writing CSSOM code is unnecessary if you use the sibling *element* selector(s) of CSS with attached CSS rules. The latter is also much easier to maintain and less error-prone (a sibling *node* can be a text node, and text nodes do not have a “style” property; as a result, a TypeError exception is thrown on this line then). In that regard, my code needs to be improved slightly so that it checks whether, if the object in question does not have a “classList” property (is not an element node), one of its ancestors has and its “class” attribute contains the pertinent class name. There is this trade-off with event bubbling to find out the proper ancestor if a descendant was the event target; this problem does not exist if event listeners are being added to the proper ancestors directly, but then it has to be added to every single one of them. Insofar using event bubbling this way might actually not always be the best strategy (speed tests pending; it is also situation- dependent). >> } >> }); >> > > Good answer. Rest assured that as a beginner you are not in any position to tell. It is a striking feature of ECMAScript-based programming languages and their applications in particular that, because they seem comparably easy to learn, people very quickly become overconfident in their estimations of their own knowledge about them. Some of them even take their hubris to writing more or less clueless books (Flanagan, Crockford, Resig). There is a culture of cargo cult programming. Blind leading the blind. A quote (ignoring the wrong spelling, indication overgeneralization): | > If you get a bunch of authors […] that state the same "best practices" | > in any programming language, then you can bet who is wrong or right... | Not with javascript. Nonsense propagates like wildfire in this field. | -- Richard Cornford, comp.lang.javascript, 2011-11-14 > Were there any browsers which supported JavaScript but not the .style > property? Yes. > FWIW I got the system to work as I want it to. The complete code is > below. Your answer may be better but I quite like what I came up with. Whether *you* *like* it does NOT matter. It must *work* for the *customer/user*. That is the first rule of software development, in particular of Web development where you have almost no idea where and under which circumstances your code is going to run. > I am not familiar with JavaScript so folks reading the code may find > things they don't like or which could be better. Again, it is not a matter of “like”. There are valid *reasons* why it is being recommended to do some things one way and not the other ways. > Feel free to criticise it. Thanks, but no, thanks. I have told you how to do this easily, efficiently, and in a backwards-compatible way. You decided to do it hopelessly complicated, inefficient, and in an incompatible way instead. Now you have to live with the consequences. > [convuluted mess] -- PointedEars FAQ: | | Twitter: @PointedEars2 | Please do not cc me./Bitte keine Kopien per E-Mail.