Created
July 30, 2018 19:28
-
-
Save AnthonyVadala/c1169f630f3b11fe6a1663636bb377ca to your computer and use it in GitHub Desktop.
Example using JS to store notes in a browser's LocalCache
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<title>JS Note Pad</title> | |
<style> | |
#note-pad { | |
height: 95%; | |
background-color: #111; | |
font-size: 1em; | |
} | |
#note { | |
color: #fff; | |
font-size: 1em; | |
} | |
.clear { | |
color: #111; | |
font-size: 1em; | |
text-decoration: none; | |
} | |
</style> | |
<!-- Note Pad JS Script--> | |
<script type="text/javascript"> | |
function storeUsernote(id) { | |
var note = document.getElementById('note').innerHTML; | |
localStorage.setItem('usernote', note); | |
} | |
function getUsernote() { | |
if (localStorage.getItem('usernote')) { | |
var note = localStorage.getItem('usernote'); | |
} | |
else { | |
var note = 'Write your note here'; | |
} | |
document.getElementById('note').innerHTML = note; | |
} | |
function clearLocal() { | |
clear: localStorage.clear(); | |
return false; | |
} | |
</script> | |
</head> | |
<body> | |
<!-- Note Pad--> | |
<div id="note-pad"> | |
<div id="note" contenteditable="true" onkeyup="storeUsernote(this.id);"></div> | |
</div> | |
<!-- Reset Note Pad--> | |
<center> | |
<a class="clear" href='' onclick='javascript:clearLocal();'>Clear</a> | |
</center> | |
<!-- Get Stored Note Data --> | |
<script> | |
getUsernote(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment