dh_0e

[JavaScript/HTML5] 비밀번호 기능 구현 및 현재 날짜와 시간 가져오기, input Type(HTML5) 본문

내일배움캠프/HTML,CSS,JavaScript

[JavaScript/HTML5] 비밀번호 기능 구현 및 현재 날짜와 시간 가져오기, input Type(HTML5)

dh_0e 2024. 4. 17. 22:57

비밀번호 기능

prompt() 함수를 사용하여 사전에 입력한 비밀번호와 일치할 때에만 작성한 카드를 삭제하도록 만듬

pw : 저장되어 있던 비밀번호 / pwIn : 사용자에게 입력받은 값

 

 

 

 

 

 

 

 

 

 

위 input에 입력한 내용이 pwIn 변수에 저장되어 기존 비밀번호를 getDoc으로 불러와 저장시킨 pw 값과 비교

 

 

 

 

 

현재 날짜, 시간 가져오기

new Date() 함수를 사용하여 글을 작성한 시간을 데이터에 저장시킴

toLocaleString() 함수 활용

 

이외에도 여러가지 함수로 날짜를 표현할 수 있다.

 

 

날짜에 관련된 함수

.getFullYear() - 객체의 년도를 가져오는 함수

.getMonth() - 객체의 월 정보를 가져오는 함수 (0~11로 표현)

.getDate() - 객체의 일자 정보를 가져오는 함수 (1~31)

.getDay() - 객체의 요일 정보를 가져오는 함수 (일요일부터 0~6)

 

 

시간에 관련된 함수

.getHours() - 객체의 시간 정보를 가져오는 함수 (0~23)

.getMinutes() - 객체의 분 정보를 가져오는 함수 (0~59)

.getSeconds() - 객체의 초 정보를 가져오는 함수 (0~59)

.getMilliseconds() - 객체의 밀리초 정보를 가져오는 함수 (0~999)

 

 

특정한 형식으로 날짜와 시간을 가져오는 함수

.toLocaleDateString() - 날짜만 뽑아주는 함수 (20xx. x. x.)

.toLocaleTimeString() - 시간만 뽑아주는 함수 (오전 x:xx:xx)

.toLocaleString() - toLocaleDateString() + toLocaleTimeString (20xx. x. x. 오전 x:xx:xx)

.toLocaleDateString('A') - A나라에서 표현하는 방식으로 날짜를 표현해주는 함수 (한국은 'ko-KR', 미국은 'en-US')

 

 

 

 

 

input type(HTML5)

 

각 속성값에 따라 지원하는 브라우저 및 버전이 다른데 크롬에선 모두 사용할 수 있다.

 

 

 

 

다음과 같이 type에 "password"를 넣으면

 

 

 

이처럼 사용자의 눈에 입력값이 보이지 않게된다.