Editible Div With Memory (localStorage)
const el = document.createElement('div')
el.innerHTML = localStorage.memory == null ? 'type here' :
localStorage.memory
el.contentEditable = true;
document.body.appendChild(el);
document.addEventListener('keyup', () => {
localStorage.memory = el.innerHTML;
});
Create an editable div that remembers what was typed in it.
createElement and Object.assign
const el = document.createElement('div');
Object.assign(el.style, {
position: 'absolute',
left: '100px',
top: '100px',
width: '30px',
height: '30px',
background: 'linear-gradient(black, red)',
transform: 'rotate(15deg)'
});
document.body.appendChild(el);
Fast and easy way to set many styles on a DOM node. Click/tap the “Try it out” button to play around with the code.