autofocus 属性

autofocus 属性は、文書が読み込まれた時やダイアログが表示された時に、指定した要素が自動的にフォーカスを持つべきであることを表します。

autofocus 属性は論理属性です。

なお、ある要素の「直近の祖先オートフォーカス範囲のルート要素」は、その要素が dialog 要素の場合はその要素自体、そうでない場合は直近の先祖に当たる dialog 要素、もしくは html 要素になりますが、同じ「直近の祖先オートフォーカス範囲のルート要素」は、autofocus 属性が指定された要素を 2 つ以上持ってはならないと仕様上は定義されています。つまり、autofocus 属性を持つ要素は、dialog 要素内に含めない限り、html 要素内には 1 つだけ、同じ dialog 要素内にも 1 つだけ存在できることになります。

<button type="submit" autofocus>
 <img src="/img/submit.png" alt="送信ボタン" />
</button>

<button type="submit" autofocus="autofocus">
 <img src="/img/submit.png" alt="送信ボタン" />
</button>