input 현재 날짜를 기본값으로 설정하기

 현재 시간을 기본값으로 설정하기 

여러개일 경우 id값 구별하기

 

- month 타입에 현재 월 설정하기

<form>
  <input type='month' id='currnetMonth'>
</form>

<script>
  document.getElementById('currnetMonth').value= new Date().toISOString().slice(0, 7);
</script>

 

- date 타입에 현재 일 설정하기

<form>
  <input type='date' id='currentDate'/>
</form>

<script>
  document.getElementById('currentDate').value = new Date().toISOString().substring(0, 10);
</script>

 

- time 타입에 현재 시간 설정하기

<form>
  <input type='time' id='currentTime'/>
</form>

<script>
  document.getElementById('currentTime').value = new Date().toISOString().slice(11, 16);
</script>

 

- datetime-local 타입에 현재 날짜, 시간 세팅하기

<form>
  <input type="datetime-local" id='currentDatetime'/>
</form>

<script>
  document.getElementById('currentDatetime').value= new Date().toISOString().slice(0, -1);
</script>

 

 

document. getElementById() : 주어진 문자열과 일치하는 id속성을 가진 요소를 찾고 element객체에 반환

document. querySelector() : id가 없는 요소

Date : 시간의 특정 지점을 나타내는 Date객체 생성

JS Date 객체 생성(초기화) : new 연산자 사용

toISOString() : 단순화한 확장 ISO형식의 문자열 반환, 반환값은 항상 24글자 또는 27글자

 

slice( begin, end ) : 원본 배열을 유지한채 배열의 begin부터 end(end미포함)에 대한 새로운 배열객체 반환

substring( begin, end ) : string 객체의 시작부터 종료전까지 문자열의 부분 문자열 반환

차이)

begin > end 일 경우

  slice -> ""

  substring -> begin과 end값을 바꾸어 처리

 

 

 

 

참고) hianna.tistory.com/319

[HTML] 날짜 입력 항목에 현재 시간을 기본값으로 세팅하기