Javascript Sec 3, Lecture 32
Local & Session Storage
>> app.js file
// set local storage item
app.js
localStorage.setItem('name', 'John');
// 브라우즈 내부에 스토리지를 통하여 값을 넣고 읽고
// set session storage item
sessionStorage.setItem('name', 'Beth');
// remove from storage
localStorage.removeItem('name');
// get from storage
const name = localStorage.getItem('name');
console.log(name);
localStorage.setItem('age', '30');
const age = localStorage.getItem('age');
console.log(name, age);
// clear local storage
localStorage.clear();
console.log(name, age);
document.querySelector('form').addEventListener('submit',
function(e){
console.log(123);
const task = document.getElementById('task').value;
let tasks;
if(localStorage.getItem('tasks') === null {
tasks = [];
} else {
// tasks = localStorage.getItem('tasks');
tasks = JSON.parse(localStorage.getItem('tasks')); // JSON 파일로 만들기..
}
tasks.push(task); // 배열변수에 값을 넣고
localStorage.setItem('tasks', JSON.stringify(tasks));
localStorage.setItem('task', task);
alert('task saved');
e.preventDefault();
});
const tasks = JSON.parse(localStorage.getItem('tasks')); // JSON 읽기
tasks.forEach(function(task){
// TODO
console.log(tasks); // 읽은것 출력...
});
index.html
'Web Code' 카테고리의 다른 글
| UI & Remove, Filter (0) | 2017.12.30 |
|---|---|
| UI & Add Task Items (0) | 2017.12.30 |
| Javascript Event Bubbling & Delegation (0) | 2017.12.29 |
| Javascript Mouse Event (1) | 2017.12.28 |
| Javascript Event (0) | 2017.12.28 |
