제이쿼리(Jquery) 변수값 출력, 그리고 data-value 값 출력 방법

<input type="text" id="ID" name"NAME" class="CLASS" data-value="DV" value="Hellow" />

 

위와 같이 input type이 텍스트인 코드가 있을 때 자바스크립트에서 변수명을 통해 값을 출력하는 다양한 방법이 있다.

 

<script type="text/javascript">

  // 아이디(id) 변수명으로 값 출력
  $('#ID').val();

  // 이름(name) 변수명으로 값 출력
  $('input[name=NAME]').val();

  // 클래스(Class) 변수명으로 값 출력
  $('.CLASS').val();

</script>

바로 위와 같이 3가지 문법으로 출력하면 출력값은 Hellow가 된다.

---

여기서 추가 꿀팁이 있다. 하나의 input 태그에는 (제가 알고 있는 경우는) 2가지 값을 저장할 수 있다. 그건 바로 

첫번째 코드블럭에 있는 data-value와 value 이다.

 

data-value의 값을 출력하는 방법은 아래와 같다.

$('#ID').data('value');

$('input[name=NAME]').data('value');

$('.CLASS').data('value');

은근 유용하게 사용된다. 

 

//감사 로그 다는 법
console.log("읽어주셔서 감사합니다.");