Java Script(JS) - Username

 

greeting.js

greeting.js

index.html

style.css

화면

form 태그로 사용자 정보를 받아서 local storage에 저장하도록 할 것이다.

loadName 함수로 사용자가 신규인지 아닌지를 판별한 후 화면에 이름을 뿌려주도록 하자.

사용자가 기존 사용자일 경우 paintGreeting 함수로, 신규 사용자일 경우 askForName()함수로 이동한다.

greeting.js

 

askForName 함수를 보면 form태그 클래스명에 SHOWING_CN을 추가하도록 되어있다.
    -> 즉,  display:none에서 block으로 변경된다는 의미.
그 후 submit 이벤트로 hadleSubmit 함수를 호출한다.

paintingGreeting 함수는 기존 사용자의 이름을 인자로 받아서 화면에 뿌려준다.

 

 

handleSubmit 함수의 event.preventDefault()는 유저가 정보를 입력하고 Enter를 칠 때 정보가
모니터  상에 남아있도록 하는 것이다.

 

event.preventDefault :이렇게 남아있는다.

 

새로 고침을 하면 기억을 못하기 때문에 이제 local storage에 저장하도록 하자

 

 

saveName 함수에 local storage로 저장하도록 한다.

 

 

로컬 스토리지에 잘 들어갔다.