about using <label>

[Dormilich]

Hi,

I just have one thing about the label element, where I’m not certain. <label> is commonly used to attach visual/text information to a form control. so far, so good.

<!-- just to make it visible -->
<input type="checkbox" value="yes" id="mysql">
<label for="mysql">save MySQL</label>

Now supposing I want to toggle the visibility of a <div> containing e.g. a description of something via JavaScript. although it is not exactly specified this way, button (and their labels) should be only written inside a <form> (that’s why they are form controls). on the other hand side, labels with their IDREF attribute for would make excellent "show content" elements … (even better than anchors, in the semantic sense)

<label for="desc1" class="trigger">show content</label>
<div id="desc1" class="hide">bla bla blubb …</div>
/* CSS */
.hide {
    display: none;
}
// JavaScript
function toggle()
{
    // for the general idea …
    var vis = document.getElementById(this.for).style.display;
    if ("none" == vis) {
        vis = "block";
        this.textContent = "hide content";
    } else {
        vis = "none";
        this.textContent = "show content";
    }
}
// after some prototyping …
document.getElementsByClassName("trigger").addEventForEach("click", toggle, false);

what do you think about this (mis)use?

[drhowarddrfine]

Nothing wrong with doing stuff like that if it works.

[Dormilich]

good ole HTML forgives nearly everything …

[aktar]

I've used custom attributes in some pages, thanks to HTMLs forgiving nature and they've proven invaluable in many places.
If you use jQuery for example, the HTML elements can be fetched by custom attributes, making the code very clean and flexible :)