분류 전체보기 (76) 썸네일형 리스트형 LocalStorage 사용법 ● LocalStorage란, '사용자의 로컬에 존재하는 저장소'로서 특정 데이터를 저장할 수 있고 페이지를 변경하거나 브라우저를 닫더라도 값은 유지된다. 또한 초기화하거나 제거(remove)할 수도 있다. 단, 도메인이 다른 경우에는 로컬 스토리지 공유가 불가능하다. Local Stroage를 어떻게 사용할 수 있을까? ◎ 데이터 저장하기 만약 우리가 String type의 데이터인 key(키) : name, value(값): jennie를 담고자 한다면 세가지 방법을 사용할 수 있다. localStorage.name = "jennie"; //1 localStorage["name"] = "jennie"; //2 localStorage.setItem("name", "jennie"); //3 만약 배열을 .. [TODO-LIST 만들기] text input 시, 화면에 띄우기 최근 JavaScript 강의를 듣고 새롭게 디자인해서 simple todo-list를 만들고 있는데 처음부터 막힐 뻔해서 당황했지만.. 다행스럽게도 생각이 나서 잠깐이나마 막혔던 부분을 적어놓으려 한다. ADD JAVASCRIPT 'use strict'; const container = document.getElementById('container'); const todoForm = document.getElementById('todo-form'); const todoInput = document.getElementById('todo-input'); const todoButton = document.getElementById('todo-button'); const todoUL = document.que.. [login] text input 시 text 화면에 띄우기 HTML Javascript 'use strict'; const loginForm = document.querySelector('#login-form'); const loginInput = document.querySelector('#login-form input[type=text]'); const greeting = document.querySelector('#greeting'); const HIDDEN_CLASSNAME = "hidden"; const USERID_KEY = "userId"; function loginHandler(event) { event.preventDefault(); //원래하던 새로고침을 막고 시작 const userId = loginInput.value;//유저 이름 저장 l.. localStorage에 user 정보가 있거나 없을 때 form 활용하기 HTML Javascript const loginForm = document.querySelector('#login-form'); const loginInput = document.querySelector('#login-form input'); const greeting = document.querySelector('#greeting'); const HIDDEN_CLASS = "hidden"; const ID_KEY = "userId"; function onLoginSubmit(event) { event.preventDefault(); loginForm.classList.add(HIDDEN_CLASS); const userId = loginInput.value; localStorage.setItem("I.. function과 event로 웹페이지 배경색을 바꾸기 강의를 보고 button click event로 웹페이지의 배경색을 바꿔보았다 WEB 'use strict'; //const btn = document.getElementById('nightDay'); 이건 소용이 없네.. function nightDayHandler(self) { const target = document.querySelector('body'); if(self.value === 'night') { //이 값이 night라면 black모드에 yellow 글자에 day btn이 있어야한다 target.style.backgroundColor = "black"; target.style.color = "Yellow"; self.value = "day"; //black 모드일 때, 버튼 이름은 d.. CSS를 HTML에 적용시키는 법 HTML 삽입 미리보기할 수 없는 소스 이전 1 ··· 5 6 7 8 다음