Así que quiero cambiar la posición del elemento en 100 al presionar el botón del teclado.
Mi código:
document.addEventListener("keypress", (event) => { var keyName = event.key; if (keyName == "s") { console.log(keyName); document.getElementById("element").style.top + 100; }; }, false); <div id="element">•</div> Y lo único que hace el código es enviar un registro a la consola sobre la tecla presionada.
EDITAR: la posición del elemento ya es Absoluta
position: absolute;Para lograr lo que está intentando, debe hacer lo siguiente:
position: absolute o position: relativestyle.top es un setter , por lo que debe establecer su valor como style.top = '100px' document.addEventListener("keypress", (event) => { const elementToMove = document.getElementById("element"); var keyName = event.key; if (keyName == "s") { elementToMove.style.top = (parseInt(elementToMove.style.top || 0) + 100)+'px'; }; }, false); <div id="element" style="position: absolute;">•</div>La propiedad CSS superior participa en la especificación de la posición vertical de un elemento posicionado. No tiene efecto sobre elementos no posicionados. Asegúrese de que su elemento esté posicionado (absoluto, relativo, fijo, estático, etc.).
Tu código tiene errores aquí: document.getElementById("element").style.top + 100; debería haber una asignación al elemento (+100) no funcionará.
si desea agregar un margen, haga lo siguiente: document.getElementById("element").style.marginTop = "100px";