offset的使用？

Question

最近在自学js，水平比较浅，希望不要嫌我问的问题比较傻呐。

好吧说正题，我在模仿幕课网上的一个js效果，但对其中一个地方弄不明白，下面贴代码：

<script>
    window.onload = function () {        var odiv = document.getElementById('div1');
        odiv.onmouseover = function () {
            startMove();
        }
    }    function startMove() {        var odiv = document.getElementById('div1');
        setInterval(function(){//            odiv.style.left = odiv.offsetLeft + 10 + "px";
            odiv.style.left = odiv.style.left + 10 + "px";

        },30)
    }</script>

我的问题主要是startMove函数里，想修改odiv.style.left为什么只能通过odiv.oddsetLeft.、
注释掉的是课程里的代码。
我自己写的是：

odiv.style.left = odiv.style.left + 10 + "px";

但图片原本的left值是-200px，这么写完之后直接变成10px了，然后我觉得是不是没有对获取到的值进行转换，就改写成这样：

odiv.style.left = parseInt（odiv.style.left） + 10 + "px";

但这次反而什么反应都没了，所以我想问下我错在哪了。
不知道叙述清楚没有