localStorage.getItem (키) : 저장된 값을 추출 / 없으면 undefined / 객체의 속성을 추출하는 일반적인 형태로 localStorage.키 or localStoreage[키]
localStorage.setItem (키,값) : 값을 저장
localStorage.removeItem (키) : 특정 키의 값을 제거
localStorage.clear() : 저장된 모든 값을 제거
<script>
document.addEventListener("DOMContentLoaded", () => {
const p = document.querySelector("p");
const input = document.querySelector("input");
const button = document.querySelector("button");
const saveValue = localStorage.getItem("input");
if (saveValue) {
input.value = saveValue;
p.textContent = `이전 실행 때의 마지막 값 : ${saveValue}`;
}
input.addEventListener("keyup", (event) => {
const value = event.currentTarget.value;
localStorage.setItem("input", value);
});
button.addEventListener("click", (event) => {
localStorage.clear();
input.value = "";
});
});
</script>
<body>
<p></p>
<button></button>
<input type="text" />
</body>