Aquí está el código en cuestión que parece estar causando problemas:
player.style.height = playerH + "px"; function trackXY(){ for(let i=0; i<pokeS.length; i++){ let pokeS = document.getElementsByClassName('pikaStyle' + i); let xPlayer = parseInt(player.style.left + .5*player.style.width); let yPlayer = parseInt(player.style.top + .5*player.style.height); let xpokeS = parseInt(pokeS.style.left + .5*pokeS.style.width); let ypokeS = parseInt(pokeS.style.top + .5*pokeS.style.height); let rPlayer = .5*parseInt(player.style.height); let rpokeS = .5*parseInt(pokeS.style.height); let dX = xpokeS - xPlayer; let dY = ypokeS - yPlayer; let distance = Math.sqrt((dX*dX)+(dY*dY)) if(distance <= (rpokeS+rPlayer)){ alert("collison!" + pokeS.id); player.style.height = parseInt(player.style.height) + .5*parseInt(pokeS.style.height); } } }sigue devolviendo que el "estilo" no se puede leer o que "izquierda" no está definido. ¿alguien puede aconsejar? Gracias.
Debe usar window.getComputedStyle() y getPropertyValue para obtener el estilo. No puede usar directamente element.style.height , no devolverá nada.
El método Window.getComputedStyle() devuelve un objeto que contiene los valores de todas las propiedades CSS de un elemento, después de aplicar hojas de estilo activas y resolver cualquier cálculo básico que esos valores puedan contener.
En su código, use:
window.getComputedStyle(player).getPropertyValue('height') window.getComputedStyle(pokeS).getPropertyValue('height')Ejemplo:
let div = document.querySelector('div') //return nothing //console.log( div.style.height) console.log(window.getComputedStyle(div).getPropertyValue('height')) div{ height:50px; } <div></div>