티스토리 뷰

HTML을 검사에서 console. element말고도 Application에 로컬 스토리지라던가 여러가지의 정보를 볼수 있는데 콘솔창에서 localeStorage.getItem("무언가")를 하면 그 결과를 볼수 있다. 그리고 또한 직접 우리정보를 수정할수도 있다.

 

Greeting your name //시계가 실행될때 greeting, Alexis 이런식으로 누구누구님 환영합니다.를 보고싶을때의 수식에 관해서 공부해 보았다.

<form clss="js-form form">
	<input type="text" placeholder="what is your name?" />
</form>
<h4 class="js-greetings greetings"></h4>
------------------------------------------------------html
.form, .greetings {
	display: none; }
.showing {
	display: block;
 }
------------------------------------------------------css
const form = document.querySelector(".js-form");
	input = form.querySelector("input"),
    greeting = document.querySelector(".js-greetings");
    
const USER_LS = "currentUser",
	SHOWING_CN = "showing"
	
function paintGreeting(text){
	form.classList.remove(SHOWING_CN)
	greeting.classList.add(SHOWING_CN)
	greeting.innerText = `Hello ${text}`
}
function loadName(){
	const currentUser = localStorage.getItem(USER_LS);
    if(currentUser === null) {
    //만약 내가 아니라면
    } else {
    paintGreeting(currentUser);
    // 만약에 내가 맞자면
    }
 }
 function init(); {
 	loadName();
 }
 init();
------------------------------------------------------JS

 

지금의 경우에서는 if currentUser = null의 구문이 비어있기때문에 실행이 되진 않는다.

댓글
© 2018 webstoryboy