[Javascript] Select Option Value속성 말고 다른 속성 사용하기

안녕하세요 이번 포스팅은 html 요소인 Select Option에서 Value값 뿐만 아니라 고유 값을 추가하고 싶을 때의 방법을 알려드리려고 합니다.

 

---

var objOption = document.createElement("option");
objOption.value = "value값";
opjOption.text = "text값";

objOption.dataset.sample = "sample값"; // 특정 고유 값 생성가능

option 객체를 생성하고, value와 text를 지정합니다.

 

value는 option의 value. 즉, 값이며

text는 option에 보여지는 텍스트입니다.

 

value외에도 고유의 값을 추가하려고할 때 dataset을 이용하시면 됩니다.

 

옵션객체.dataset.값이름 = "고유값"

을 하게 되면 자유롭게 option값에 데이터를 넣고 뺄 수 있습니다.

 

dataset으로 속성 접근은 IE에서 지원되지 않습니다.

 

IE도 접근하기 위해서 dataset 대신 getAttribute / setAttribute를 이용하면 됩니다.