)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

Editible Div With Memory (localStorage)

  1. const el = document.createElement('div')
  2. el.innerHTML = localStorage.memory == null ? 'type here' :
  3.   localStorage.memory
  4. el.contentEditable = true;
  5.  
  6. document.body.appendChild(el);
  7. document.addEventListener('keyup', () => {
  8.   localStorage.memory = el.innerHTML;
  9. });

Create an editable div that remembers what was typed in it.

createElement and Object.assign

  1. const el = document.createElement('div');
  2. Object.assign(el.style, {
  3.   position: 'absolute',
  4.   left: '100px',
  5.   top: '100px',
  6.   width: '30px',
  7.   height: '30px',
  8.   background: 'linear-gradient(black, red)',
  9.   transform: 'rotate(15deg)'
  10. });
  11. 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.

// css // dom // tricks
snippet.zone ~ 2021-24 /// {s/z}