コントロールの属性・グローバル属性

form属性やname属性、value属性など、複数種類のフォームコントロールで共通の属性が存在します。今回はそれをまとめて解説します。

disabled属性

前回fieldset要素の面白い特性といいましたが、何かというとそれはdisabled属性です。

disabled属性はフォームコントロールに共通の属性で、論理属性です。意味は、無効化されているかどうかです。disabled属性があるとき、そのコントロールは無効化されていて使えません。

そして、実はfieldset要素にも特別にこの属性があります。fieldset要素にdisabled属性が指定された場合、そのグループの要素全てが無効化されます。

autofocus属性

autofocus属性はその名のとおり、オートフォーカスするコントロールを指定するものです。オートフォーカスとは、ページを読み込んだらすぐそのコントロールにフォーカスする（カーソルを移して編集可能にする）ことです。当然ながら、1つのページに1つしか指定できません。

グローバル属性

これだけだと短いので、さらにグローバル属性を紹介します。以前、グローバル属性のひとつとしてid属性を紹介しました。グローバル属性とは、全ての要素に指定できる属性でしたね。

実はid属性以外にもたくさんあります。

accesskey属性

accesskey属性は、その要素にアクセスするのに押すべきキーを指定します。アクセスするとは、例えばa要素ならリンク先へ移動、input要素ならその要素のフォーカスするなどがあります。

accesskey="A"のようにした場合Aキーとなりますが、ただのAではなくShift+AとかCtrl+Alt+Aとかになる場合もあり、ユーザーエージェント（ブラウザなど）により適切に判断されます。

複数候補を指定することもでき、キーをスペースで区切ります。

contentediable属性

contentediable属性は、"true"または"false"を値に持つ属性で、"true"ならばその要素は編集可能になります。編集可能とはどういうことかというと、その要素のテキストが入力ボックスのようになり書き換えられるということです。論理属性のようですが違うので注意しましょう。

ユーザーにデータを入力させたい場合はtextarea要素を使うのがスイショウされます。

hidden属性

hidden属性は論理属性です。ある場合、その要素は隠され表示されません。hidden属性の意味は、その要素がまだ関連性がない・もう関連性がないことを表します。

しかし、要素を隠すためならどんなときでもhidden属性を使っていいわけではありません。あくまで関連性がない場合です。例えば、オンラインゲームを作ったとき、ログインするまではまだゲームの画面を隠しておく、といった場合に使用可能です。

lang属性

lang属性は言語を表します。例えば"ja"なら日本語、"en"なら英語などです。いろいろ複雑な決まりがあるのですが、そこまで意識することは少ないと思われます。

これは、日本語で書かれた文章中に英語で書かれた部分がある場合などに力を発揮します。例えば、英語の文をq要素で引用してきた場合に、<q lang="en">のようにすることができます。

spellcheck属性

spellcheck属性は"true"または"false"で、"true"のときスペルチェック・文法チェックを行ってくれます。しかし、多分英語しか行ってくれないでしょう。日本語は難しいです。

スペルチェックを行ってくれるのは、input要素やtextarea要素、そしてcontentediatble属性が"true"の要素です。

tabindex属性

tabindex属性は、その要素がタブキー（環境によっては違うかもしれません）でフォーカスを移動することができるようにし、さらにその順番を数字で指定します。数値が小さいほど先に到達できますが、マイナスにすると到達できなくなります。

主にフォームコントロールに使われます。

title属性

title属性は汎用性の高い属性で、その要素の補足情報となる文字列です。

例としては、画像なら著作権表示などだったり、a要素のリンクならリンク先の説明など、わりと自由に設定できます。

独自データ属性

独自データ属性というのは、作成者が自由につくって使える属性です。

JavaScriptなどで要素にデータを持たせておきたいときなどに使用できます。しかし何でも好きな名前というわけではなく、"data-"で始まる名前（"data-length"とか）である必要があります。