[whatwg] getElementsByClassName()

[Chris Casciano]

On Feb 3, 2006, at 9:30 AM, Jim Ley wrote:

> On 2/3/06, Gervase Markham <gerv at mozilla.org> wrote:
>> Jim Ley wrote:
>>>  the document of course shows no use cases at all.
>>
>> Is there some doubt that the ability to tag an arbitrary set of 
>> elements
>> and later easily get an array of those elements is a useful feature 
>> for
>> web development?
>
> I've yet to hear of an actual reason to do so, people keep saying it
> seems useful...
>
>> If you would like use cases, I present all of the web pages currently
>> using a JS implementation of getElementsByClassName based on
>> getElementsByTagName("*") and some manual class name inspection logic.
>
> Yes, but they're all using it to attach events to every one of the
> class, which is why you have to look at use cases, the reason they're
> doing it is not because getElementsByClassName is missing, but because
> addEventListenerToClass or -moz-binding etc. are missing.
>
> It's the classic mistake of looking at making the workarounds easier,
> when you should be looking at making the underlying use easier.
>
> Jim.
>

Jumping in a little late here, and with a theoretical case only in that 
I haven't implemented the specific combination of scripting the 
animations and the markup, but work with me here....

* Take a form that has been processed with some validation error 
conditions met
* Use CSS class "error" to mark some specific text elements your 
favorite shade of red
* Add on of those fancy "somethings changed here" javascript animations 
the AJAXy kids love to use

And you have something like this (please forgive markup errors):


<p class="error">Some information was missing. Please fill out the 
entire form</p>
<form>

<fieldset>
<legend>Who are you?</legend>
<label class="error" for="fn">Name:</label> <input type="text" id="fn" 
/>
</fieldset>

<fieldset>
<legend class="error">Favorite Sports (Pick at least one)</legend>
<input type="checkbox" id="hockey" /> <label for="hockey">Hockey</label>
<input type="checkbox" id="football" /> <label 
for="football">Football</label>
<input type="checkbox" id="baseball" /> <label 
for="baseball">Baseball</label>
</fieldset>

</form>


And a script that on document load (or some other event based trigger 
like a fresh validation attempt.. point being the event listener is 
elsewhere) that would grab all of the elements in the page with class 
"error" and give them an animated/fading border and background for a 
few seconds.

Just the first case that popped into my head. Another rough case would 
be a file serving application[1] where a "thumbnail" isn't always an 
<img> but sometimes a <span>No Preview Available</span> or perhaps a 
flash or sound player <object> (or maybe in the future SVG) but in all 
cases the element used is categorized by class="preview".

if pressed I could probably look over some old work with scripting 
animations/dhtml and find cases where this would also be very helpful, 
but they would be less applicable to your typical html usage.

[1] in an app like this one: http://files.lussumo.com/

-- 
[ Chris Casciano ]
[ chris at placenamehere.com ] [ http://placenamehere.com ]