사과먹는중
당근먹는하니
귀엽고 행복해
당근먹는하니
전체 방문자
오늘
어제
  • 분류 전체보기 (274)
    • 다람쥐🐿 (26)
    • C++ 공부빵야 (7)
    • 공부👻 (5)
    • 프론트엔드✏️ (228)
      • 코드캠프 (120)
      • 팀 프로젝트✨ (31)
      • 개인공부 (67)
    • 프론트엔드 - 바닐라js (7)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 코딩
  • refreshtoken
  • graphql
  • 자바스크립트
  • emotion
  • 공통 컴포넌트
  • 리액트
  • 팀 프로젝트
  • React-hook-form
  • 배포
  • 배열
  • 회고
  • JS
  • javascrpit
  • 팀플
  • 부트캠프
  • 코드캠프
  • typescript
  • 팀프로젝트
  • react
  • 코딩 부트캠프
  • 프론트엔드
  • 알고리즘
  • ssg
  • 프로그래머스
  • algorithm
  • next.js
  • HTML
  • javascript
  • CSS

최근 댓글

최근 글

티스토리

250x250
반응형
hELLO · Designed By 정상우.
당근먹는하니
프론트엔드 - 바닐라js

[javascript] 바닐라 JS로 크롬 앱 만들기 - #7.1 ~ toDo list

[javascript] 바닐라 JS로 크롬 앱 만들기 - #7.1 ~ toDo list
프론트엔드 - 바닐라js

[javascript] 바닐라 JS로 크롬 앱 만들기 - #7.1 ~ toDo list

2022. 10. 6. 11:14
728x90
반응형

 

삭제는 li 안에 버튼을 만들고, 

function deleteToDo(event) {
  const li = event.target.parentElement;
  li.remove();
}

event.target.parentElement(즉 li)를 지우는 방법을 쓴다.

 

 

할 일을 저장하기 위해서 로컬 스토리지를 사용한다. 

localStorage.setItem(TODOS_KEY, JSON.stringify(toDos));
 
배열, 오브젝트 등을  string으로 저장할 수 있게 해주는 JSON.stringify
 
const savedToDos = localStorage.getItem(TODOS_KEY);

if (savedToDos) {
  const parsedToDos = JSON.parse(savedToDos);
}

그걸 다시 배열, 오브젝트로 바꿔주는 JSON.parse 

 

728x90
반응형
저작자표시 비영리 동일조건 (새창열림)

'프론트엔드 - 바닐라js' 카테고리의 다른 글

... spread 연산자  (0) 2022.12.29
[javascript] 바닐라 JS로 크롬 앱 만들기 - 끝  (0) 2022.10.11
[javascript] 바닐라 JS로 크롬 앱 만들기 - 오늘의 기분 선택하기, 디데이까지~  (0) 2022.10.06
[javascript] 바닐라 JS로 크롬 앱 만들기 - 디데이 숙제  (0) 2022.10.05
[javascript] 바닐라 JS로 크롬 앱 만들기 #3.0 - #3.4  (0) 2022.09.21
    '프론트엔드 - 바닐라js' 카테고리의 다른 글
    • [javascript] 바닐라 JS로 크롬 앱 만들기 - 끝
    • [javascript] 바닐라 JS로 크롬 앱 만들기 - 오늘의 기분 선택하기, 디데이까지~
    • [javascript] 바닐라 JS로 크롬 앱 만들기 - 디데이 숙제
    • [javascript] 바닐라 JS로 크롬 앱 만들기 #3.0 - #3.4
    당근먹는하니
    당근먹는하니

    티스토리툴바

    단축키

    내 블로그

    내 블로그 - 관리자 홈 전환
    Q
    Q
    새 글 쓰기
    W
    W

    블로그 게시글

    글 수정 (권한 있는 경우)
    E
    E
    댓글 영역으로 이동
    C
    C

    모든 영역

    이 페이지의 URL 복사
    S
    S
    맨 위로 이동
    T
    T
    티스토리 홈 이동
    H
    H
    단축키 안내
    Shift + /
    ⇧ + /

    * 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.