JSFiddle - React, Tailwind, and code Playground
HTML
<input id="storeData" type="text" value="">
<input id="submit" type="button" value="store">
<input id="checkSaved" type="button" value="check">
<div id="console-log"></div>
CSS
.console-line {
font-family: monospace;
margin: 2px;
}
JavaScript
/* *1 Console.log tweak */
var consoleLine = "<p class=\"console-line\"></p>";
console = {
log: function (text) {
$("#console-log").append($(consoleLine).html(text));
}
};
/* *1 End */
Storage.prototype.setObj = function(key, obj) {
return this.setItem(key, JSON.stringify(obj))
}
Storage.prototype.getObj = function(key) {
return JSON.parse("\""+this.getItem(key)+"\"");
}
$("#submit").on("click", function () {
val=document.getElementById("storeData").value;
localStorage.setItem(""+val,val);
});
$("#checkSaved").on("click", function () {
$("#console-log").html("");
if (localStorage.storeValues) {
for (var i = 0; i < localStorage.length; i++){
console.log(localStorage.key(i));
}
}
});