HTML aside标签:可以用于表单错误消息吗？

Question

所以我有一个表单,我将有与每个输入/元素相关的错误消息.我已经为<aside>标签提出了这个用法,并想知道人们的想法:

    <section class="fieldrow" id="rowJobTitle">

        <label for="txtJobTitle" id="lblJobTitle">
            <span>Job title:</span>
        </label>

        <input type="text" id="txtJobTitle" name="txtJobTitle">

        <aside id="errJobTitle" class="errormessage">
            <span role="alert">Please tell us your job title.</span>
        </aside>

    </section>

然后我将使用CSS来显示或隐藏<aside>错误,用一点JS来改变它.

我知道我可以使用跨度,并完成它,但是span标签没有语义价值,我读过的所有(简短和模糊)信息<aside>似乎都说没有问题,但我是希望我能得到一些确认,或者之前尝试过这个的人,并找到一个很好的理由不这样做.

谢谢,Si.

Answer 1

<aside>所有主流浏览器都支持该标记.

但是,有一些更优雅的方法可以做到这一点,<aside>并不是特别符合你的意思.来自HTML5规范:

aside元素表示页面的一部分,其中包含与aside元素周围的内容相切的内容,并且可以将其视为与该内容分开.这些部分通常在印刷字体中表示为侧边栏.

您的错误与内容并没有真正分开,因此这是一个相当不合适的选择.

您应该看看Twitter Bootstrap如何进行内联表单错误.

总而言之,这是语义学,因此本质上是主观的.如果它对你有意义并且它有效,为什么不使用它呢？

编辑

阅读Rob的链接后,<aside>看起来比我想象的更不合适.由于<aside>不是它的子元素,<input>因此解析器没有理由认为它与之相关<input>.我会在这种情况下避免使用它.

MDN为此提供了一些用例,而您的用例不适合:

它们通常包含诸如词汇表定义之类的侧面解释,更广泛相关的内容,如广告,作者的传记,或网络应用程序,个人资料信息或相关的博客链接.