Geek asks and answers

Code simplification

The code I have is a little long, I think there is a way to simplify it, take a look at it:

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';

It is not possible to do something like this:

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

Many thanks!

+3
source share
3 answers

Yes. Wrap it in a loop for.

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

I think you should pick up the Intro to Programming book, though if you didn’t know about cycles (what point is a computer if it doesn’t care about duplicate materials for you?)

EDIT: By the way, the loop foris short for the following loop construct while:

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

" " , , . ( while , , , , i++;, .)

+5

.

var slidernav = document.getElementsByTagName('li');
slidernavinital = 20;
slidernavadd = 30;
for (var n = 0; n<slidernav.length; n++) {
    slidernav[n].style.top = slidernavinital + slidernavadd*n + 'px';
}
+1

you can use for

like this

var ln = slidernav.length;
for(var i = 1;i<=ln;i++)
{
    slidernav[i].style.top = slidernavinital + slidernavadd*i + 'px';
}

it is a very simple programming construct.

0
source

More articles:


All Articles