[HTML] - 데이터(data) 속성 사용법

#데이터(data) 속성 사용법

 

 

-특정한 데이터를 DOM요소에 저장할 수 있다.

-'data-' 형식으로 시작해야한다.

#예시

<input data-value="3" type="text" id="data_test1" />
<input data-test-value="5" type="text" id="data_test2" />

<script>

  let dataTest1 = "";
  let dataTest2 = "";
  
  // data- 다음에 오는 단어들이 식별자가 된다.
  dataTest1 = $("#data_test1").data('value');
  
  // test-value => testValue(dataset이 자바스크립트이기 떄문에 camelCase에 맞춰서 변환된다.) 
  dataTest2 = $("#data_test2").data('testValue');
  
  console.log(dataTest1); // 3
  console.log(dataTest2); // 5
  
</script>