html - 角色="radiogroup"和角色="radio"真的有必要吗？

Question

有一些 ARIA 教程网站使用非语义标记和一些 javascript 来演示 role="radiogroup" 和 role="radio" 的使用，例如以下示例:

<ul role="radiogroup">  
    <li tabindex="-1" role="radio" aria-checked="false">  
        <img role="presentation" src="radio-unchecked.gif">
        Option1
    </li>  
    <li tabindex="0"  role="radio" aria-checked="true">  
        <img role="presentation" src="radio-checked.gif">
        Option2
    </li>  
</ul>

但是，当我们已经有了语义和无 javascript 的方法时，使用那些 role 有什么意义:

<ul>  
    <li>  
        <input  id="opt1" type="radio" name="opt" value="1">
        <label for="opt1">Option1</label>
    </li>  
    <li>  
        <input  id="opt2" type="radio" name="opt" value="2">
        <label for="opt2">Option2</label>
    </li>  
</ul>

Answer 1

因为有些人真的非常想要他们的表单控件的自定义设计，并且会用图像和一堆 JavaScript 代替它们，而不管是否存在语义上合适的元素。

角色这样做只是为了减轻损害。