<datalist>

データリスト（タグ）

意味入力候補の提示

<datalist>とは？

<datalist>タグは、<input>要素で事前に定義された選択肢を表します。選択肢は入力候補として表示されます。

<datalist>の具体的な使い方

入力候補リストの例

<input list="browsers">
<datalist id="browsers">
  <option value="Chrome">
  <option value="Safari">
  <option value="Edge">
</datalist>

事前に定義された入力候補を表す例です。

<datalist>に関するよくある質問

Q. <datalist>の使い方は？

A. <datalist>は<input>要素と組み合わせて使います。<input>のlist属性と<datalist>のid属性を一致させることで、入力候補を提示できます。

Q. 入力候補は必ず選ぶ必要がある？

A. いいえ、<datalist>は候補を提示するだけで、ユーザーは候補以外の値を自由に入力することができます。

Q. <select>との違いは何ですか？

A. <select>は選択肢から必ず1つを選ぶのに対し、<datalist>は候補を提示するだけで、自由入力も可能です。また、<datalist>は入力中に候補をフィルタリングできます。

HTMLの<datalist>についても学べる書籍の紹介

「プログラミング単語帳」を使って、プログラミングの単語を英単語のように学習してみませんか？
プログラミング単語帳には、HTMLの<datalist>や<figcaption>、<strong>、<!DOCTYPE>、などのような実務でよく使われる単語が数百以上収録されています。
この書籍には、プログラミングの単語の意味や読み方、単語の使い方がわかる例文などが掲載されており、いつでもどこでもプログラミングの学習ができます。

よく使われる単語にだけ絞って学習することができるので、効率的にプログラミングが学習できます。