how to move an object with arrow keys in javascript

moveblock.js

// <div id="block" style="position: absolute; top: 0; left: 0; width: 100px; height: 100px; background-color: red;"></div>

<script>
  let modifier = 5;
  window.addEventListener('keydown', (event) => {
    const { style } = block;
    switch(event.key) {
      case 'ArrowUp': style.top = `${parseInt(style.top) - modifier}px`; break;
      case 'ArrowDown': style.top = `${parseInt(style.top) + modifier}px`; break;
      case 'ArrowLeft': style.left = `${parseInt(style.left) - modifier}px`; break;
      case 'ArrowRight': style.left = `${parseInt(style.left) + modifier}px`; break;
    }
  });
</script>