Required vs aria-required

在HTML表单中，通常需要强制要求用户填写某些字段，这就涉及到了required和aria-required属性的使用。

Required属性

required是HTML5中的一个属性，用于标识一个输入字段是必填的。当表单提交时，浏览器会检查所有带有此属性的表单元素，如果没有填写则会给出相应的提示。

例如：

<label for="username">用户名：</label>
<input type="text" id="username" name="username" required>

上例中，input元素带有required属性，当用户未填写用户名时，表单提交时会给出提示。

Aria-required属性

aria-required是用于辅助技术（比如屏幕阅读器）的一个属性，它是ARIA规范定义的。该属性被用于标识表单控件是否为必填字段。

与required属性不同的是，aria-required属性并不会影响浏览器默认的表单验证功能。它是用于告诉屏幕阅读器等辅助技术，该控件是否是必填的。

例如：

<label for="username">用户名：</label>
<input type="text" id="username" name="username" aria-required="true">

上例中，input元素带有aria-required属性，屏幕阅读器会提示用户该字段为必填字段。

总结

required属性是HTML5的原生属性，用于标识一个表单控件是必填字段，但它只影响浏览器的默认表单验证功能，对辅助技术无影响。而aria-required是一个ARIA属性，用于告诉辅助技术该表单控件是否为必填字段。

在实际使用中，我们应当根据具体情况来选择使用哪一个属性。如果希望表单控件既要在浏览器中进行验证，又要在辅助技术中进行提示，那么应该两个属性都加上。

参考文献：

• HTML5 required attribute： https://www.w3schools.com/tags/att_input_required.asp
• ARIA aria-required attribute： https://www.w3.org/TR/wai-aria-1.1/#aria-required