기타/기타 잡다한 것들

[JAVASCRIPT] 모멘텀 클론코딩 3

제주도소년 2019. 5. 27. 14:18

노마드 코더의 모멘텀 클론코딩3

 

이 단계에서 할 것 : User Name 을 입력받아 컴퓨터에 저장한다.

 

1.  index 파일 수정

1.1 아래와 같이 index.html 파일에 form 과 input 을 넣고 form에 대해 클래스를 지정한다.

1.2 h4 태그를 선언하고 class 를 지정한다.

2. grettings.js 파일 생성 및 CSS 수정

2.1 먼저 html 파일에서 선언했던 요소들을 쓰기위해 querySelector 로 가져와야 한다.

2.2 먼저 부모요소인 도큐먼트에있는 js-form 이라는 클래스를 가져오고 그 다음 자식요소인 input 을 가져온다.

2.3 함수를 총 3개(paintGreeting, loadName, init) 을 만들어 주고 아래와 같이 코딩한다.

2.4 먼저 init() 함수가 실행되면서 loadName() 함수를 호출한다.

2.5 loadName 함수에서 localStorage 안에서 currentUser를 가져온다.

2.6 가져온 값이 null이 아니면 글자를 나타내는 paintGreeting 함수를 호출한다.

2.7 paintGreeting 함수는 text를 인자로 받아서 display 상태를 변경하고 h4 태그 안에 텍스트를 출력한다!

 

다음편에 계속 ..