简化守则

Question

我的代码有点长,我认为有一种方法可以简化它,看看它:

var slidernav = document.getElementsByTagName('li');
slidernavinital = 20;
slidernavadd = 30;
slidernav[0].style.top = slidernavinital + slidernavadd*0 + 'px';
slidernav[1].style.top = slidernavinital + slidernavadd*1 + 'px';
slidernav[2].style.top = slidernavinital + slidernavadd*2 + 'px';
slidernav[3].style.top = slidernavinital + slidernavadd*3 + 'px';
slidernav[4].style.top = slidernavinital + slidernavadd*4 + 'px';
slidernav[5].style.top = slidernavinital + slidernavadd*5 + 'px';
slidernav[6].style.top = slidernavinital + slidernavadd*6 + 'px';
slidernav[7].style.top = slidernavinital + slidernavadd*7 + 'px';
slidernav[8].style.top = slidernavinital + slidernavadd*8 + 'px';
slidernav[9].style.top = slidernavinital + slidernavadd*9 + 'px';
slidernav[10].style.top = slidernavinital + slidernavadd*10 + 'px';
slidernav[11].style.top = slidernavinital + slidernavadd*11 + 'px';

是不可能做这样的事情:

document.getElementsByTagName('li')[x].style.top = 20 + 30*x + 'px';

非常感谢提前!

Answer 1

是.将它包裹在一个for循环中.

for(var i = 0; i < sliderNav.length; i++) {
    sliderNav[i].style.top = sliderNavInitial + sliderNavAdd*i + "px";
}

我认为你应该选择一本编程入门书,但是,如果你不了解循环(如果计算机没有处理重复的东西,那么计算机有什么意义？)

编辑:顺便说一句,for循环是以下while循环结构的简写:

var i = 0;
while(i < sliderNav.length) {
    sliderNav[i].style.top = sliderNavInitial + sliderNavAdd*i + "px";
    i++;
}

它只是将所有"簿记"放在循环的第一行,这样你就可以更容易地预测循环的次数.(while循环只是循环直到满足条件,然后停止,所以如果你忘记包含该i++;部分,它将永远不会停止.)