JavaScript | JQuery | input 값 변경하는 방법

javascript jquery input 값 변경

자바스크립트를 이용한 값 변경

자바스크립트를 이용해 input 엘레멘트에 담겨 있는 값을 변경하고 싶을 때가 있다. 다양한 방법 중 jquery를 이용한 방법을 살펴보려고 한다.

attr

input 엘레멘트는 value라는 속성(attribute)을 가질 수 있다. 이 value 값을 수정하면 input에 작성된 값을 바꿀 수 있는 것을 이용할 것이다.

 

<input id='inputArea' value='1' type='number'></input>

위와 같은 input 엘레멘트가 있다고 하자. 단순히 위의 input에 입력된 값을 '사랑'으로 바꾸는 스크립트는 다음과 같다.

$('#inputArea').attr("value", "사랑);

jQuery의 selector를 이용해서 inputArea 아이디를 갖고 있는 input 엘레멘트를 선택한 다음 attr 함수를 이용해 value="사랑"이라는 속성을 추가했다.