getcomputedstyle对象javascript问题

Question

我对getComputedStyle方法有一个问题。当单击元素时，我试图获取元素的左属性和顶部属性。

我能够访问‘左侧’属性，但是'top‘属性返回一个对象，而不是字符串。

我循环遍历元素数组，附加两个事件侦听器。单击事件启动后，当我按下目标div上的键时，我可以从左向右移动，但向上/向下没有任何作用。top的样式返回窗口对象。

我还在代码的前面部分定义了左边和顶部的css声明。

任何帮助都将不胜感激！

Object.keys(source_boxes).forEach(function(key){

        source_boxes[key].addEventListener('click',function(){
            clicked = true;
            elem = source_boxes[key];
        });

        document.addEventListener('keydown',function(e){
            e.preventDefault();
            if(clicked == true){
                css = getComputedStyle(elem);

                top =parseInt(css['top']);
                left =parseInt(css['left']);

                if(e.code ==="ArrowUp"){
                    top = top -5;
                    elem.style.top = top +'px';
                }else if(e.code ==="ArrowDown"){
                    top = top +5;
                    elem.style.top = top +'px';
                }else if(e.code ==="ArrowLeft"){
                    left = left -5;
                    elem.style.left = left +'px';
                }else if(e.code ==="ArrowRight"){
                    left = left +5;
                    elem.style.left = left +'px';
                }
            }



        });
    });

Answer 1

没有var、const或let关键字的const将映射到隐式全局window.top，即已经在浏览器中使用，无法设置。