在前面的文章《原生js实现别踩白块小游戏（六）》中，为大家介绍了实现别踩白块小游戏的js代码中移动效果的方法概述。

下面我们就继续结合源代码中js代码部分，为大家介绍具体的实现方法。

相关js代码如下：

//移动效果
function move(obj) {
    //默认速度与计分
    var speed = 5, num = 0;
    obj.timer = setInterval(function () {
        //速度
        var step = parseInt(getComputedStyle(obj, null)['top']) + speed;
        obj.style.top = step + 'px'
        if (parseInt(getComputedStyle(obj, null)['top']) >= 0) {
            CDiv('row');
            obj.style.top = -150 + 'px';
        }
        if (obj.children.length == 6) {
            for (var i = 0; i <p>此段代码就是用于实现游戏区域移动的功能效果。这里我们定义了两个变量，速度<strong>speed</strong>和分数<strong>num</strong>，并设置初始值分别为5和0。然后又通过<strong>setInterval</strong>() 方法设置了一个定时器。在setInterval() 方法中，存在两个参数，第一个参数则是要执行的函数循环体，第二个参数则表示间隔多少毫秒来调用此函数（这里是20毫秒）。</p><p>那么在第一个参数的函数中，<strong>getComputedStyle(obj, null)['top']</strong>方法就是用来实现给main获取设置top属性。<br></p><p style="text-align: center;"><img src="https://img.php.cn//upload/image/170/146/194/1546049717687880.jpg?x-oss-process=image/resize,p_40" title="1546049717687880.jpg" alt="f3d5d7f0afc914d2f9c62010961b562.jpg"></p><p><strong>setInterval</strong>() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式，setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。</p><p>注： </p><p>1000 毫秒= 1 秒。 如果你只想执行一次可以使用 <strong>setTimeout</strong>() 方法。</p><p><strong>getComputedStyle</strong>()方法返回的是一个CSS样式声明对象。</p><p>由于文章篇幅的问题，我们在后期的文章中再继续为大家介绍别踩白块小游戏的js实现方法。</p>