求教关于 setInterval 问题

  window.onload=function(){
            var aLi=document.getElementsByTagName('li');
            for(var i=0; i<aLi.length; i++) {
                aLi[i].onmouseover = function () {
                    var ul = this.getElementsByTagName("ul")[0];
                    if(ul){
                        clearInterval(ul.time);
                        ul.time = setInterval(function(){
                            ul.style.height = ul.offsetHeight + 8 +"px";
                            if(ul.offsetHeight >= 150){
                                clearInterval(ul.time);
                            }
                        },30);
                    }
                }
                //鼠标离开菜单，二级菜单动画收缩起来。
                aLi[i].onmouseout = function () {
                    var ul = this.getElementsByTagName("ul")[0];
                    if(ul){
                        clearInterval(ul.time);
                        ul.time = setInterval(function(){
                            ul.style.height = ul.offsetHeight - 8 +"px";
                            if(ul.offsetHeight <= 0){
                                clearInterval(ul.time);
                            }
                        },30);
                    }
                }
            }
        }

这段代码是二级导航条的练习，现在一切正常，问题是只要我把 setInterval 那行的 var ul.time = setInterval(...) 改成 var ul.ppp 之类的任何名字然后当然也会把clearInterval 更新了，这时候代码就不能用了二级菜单会出现抖动现象而且甚至会一直挂在页面上不收回去，请问这个是什么问题？难道说这玩意儿还真和名字有关?