HTML datalist Tag
BLUF: Mastering HTML datalist Tag is a fundamental step in becoming a web developer. This guide covers the structure, syntax, and best practices for using this HTML element effectively.
Key Lesson: HTML datalist Tag
Web structure starts with solid HTML. Learn how HTML datalist Tag contributes to accessible and semantic web pages in the tutorial below.
The HTML <datalist> tag is utilized to enable an autocomplete functionality on form elements. It presents users with a set of predetermined choices for selecting data.
The datalist tag is introduced in HTML5.
The <datalist> element is best utilized in conjunction with an <input< element that contains a "list" attribute. The value of "list" attribute is linked with the datalist id.
The HTML datalist tag supports global and event attributes also.
HTML datalist tag example
Let's see the simple example of HTML5 datalist tag. If you press A, it will show a list of cricketers starting with A letter.
<label>
Output:
Supporting Browsers
| Element | Chrome | IE | Firefox | Opera | Safari |
|---|---|---|---|---|---|
<datalist> |
Yes | Yes | Yes | Yes | Yes |
