-
Notifications
You must be signed in to change notification settings - Fork 10
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[1주차] 오대균 미션 제출합니다. #1
base: master
Are you sure you want to change the base?
Changes from 1 commit
973977e
1d64edf
dd15cd2
8af7471
b292514
3661d25
a41189c
7f149f5
04c806f
be1b69b
ff43d6e
d0b7045
76e5d66
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
// localStorage에서 todo elements 가져오기, 시간을 Date형식으로 변환하기 위해 map 함수를 사용 | ||
const TODOS = JSON.parse(window.localStorage.getItem('todos')).map((todo) => ({ | ||
...todo, | ||
date: new Date(todo.date), | ||
})); | ||
|
||
for (const todo of TODOS) { | ||
const ul = document.querySelector('.todoList'); | ||
const newLi = document.createElement('li'); | ||
const contentDiv = document.createElement('div'); | ||
const dateDiv = document.createElement('div'); | ||
const doneBtn = document.createElement('button'); | ||
const deleteBtn = document.createElement('button'); | ||
|
||
contentDiv.innerHTML = todo.content; | ||
dateDiv.innerHTML = todo.date.toISOString(); | ||
doneBtn.innerHTML = 'done'; | ||
doneBtn.classList; | ||
deleteBtn.innerHTML = 'delete'; | ||
|
||
newLi.appendChild(contentDiv); | ||
newLi.appendChild(dateDiv); | ||
newLi.appendChild(doneBtn); | ||
newLi.appendChild(deleteBtn); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 저도 여러 개 노드들 추가할 때 appendChild를 반복해서 썼었는데, 다른 방법이 없을까 하고 찾아보니까 append() 를 사용하면 문자열을 포함해서 여러 개 요소들을 추가할 수 있는 것 같아서 참고하시면 좋을 것 같습니다 😀 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 오 새롭게 알게되었네요~~ 다음에 element 추가할 때에는 append를 사용해보겠습니다~~ |
||
|
||
if (todo.priority === 3) newLi.classList.add = 'high'; | ||
else if (todo.priority === 2) newLi.classList.add = 'mid'; | ||
else newLi.classList.add = 'low'; | ||
ul.appendChild(newLi); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
핵심적인 부문에 주석이 적용되어 이해가 편했습니다 ㅎㅎ