<datalist>

<input 의 list와 함께 쓰이는 요소
다른 컨트롤에서 고를 수 있는 가능한, 혹은 추천하는 선택지를 나타내는 <option>요소 여럿을 담습니다.

 

label 의 for 요소가 input의 name과 연결고리가 있는 것 처럼 datalist에서의 연결고리는 id 이고 input에는 list와 연결한다.

 

See the Pen Untitled by Jeong-Dagyeong (@jeong-dagyeong) on CodePen.

 

<select>와 다른점

- select는 수정이 불가하지만 <datalist>는 input이기 때문에 수정하여 데이터를 보낼 수 있다.

- 리스트 중 단어 몇개만 쳐도 관련된 데이터들이 목록을 이룬다