22.12.08 목요일
📌 메모 추가 기능 및 localstorage 저장
기능 구현 중 추가 버튼 누르면 추가가 되지 않아서, 코드를 뜯어보고 있었는데, 갑자기 스타일링 한게 변해서 다시 코드 정리 해야하는데..
마무리 하지 못하고 내일로 미뤘다..
메모 추가 하고 로컬스토리지에 저장하고 메모 삭제하는 기능까지 내일 다 마치자!
https://github.com/yeonjujeong0511/JS-TIL/tree/memo
22.12.10 토요일
📌 메모 추가기능과 삭제기능
콘솔에 찍어보니까, 처음부터 값을 못 불러와서 추가기능을 할 수가 없었다.
다시 값을 불러오고, 추가랑 저장 기능을 구현하고 삭제 기능까지 구현 했다.
- element.setAttribute(속성명,속성값)
- e.target.parentElement.dataset
.dataset이 뭐지?
DOM 생성시점에 속성을 파싱해서 "data-" 로 시작하는 속성은 표준 데이터셋 속성으로 인식합니다.
이 "data-*" 속성들은 노드의 dataset 맵에 모아져 저장되며, 객체 프로퍼티 접근 방법으로 각각의 속성에 접근할 수 있습니다.
속성이 DOM에 저장될 때, 속성이름의 "data-"는 삭제되고 뒷부분만 속성(프로퍼티) 이름으로 사용됩니다.
HTML 태그 기능 확장을 위한 데이터를 표시할 수 있기 때문에 대부분의 HTML 라이브러리, 자바스크립트 라이브러리에서 고유의 기능 구현을 위해 데이터셋 속성을 사용합니다.
성장중인 개발자🫰