Skrócona metoda JavaScript do duplikowania ciągów znaków

Question

Mam ten kod w funkcji i chcę go skrócić - stosuje ten sam styl do każdego elementu w tablicy.

document.getElementById(divsArray[0]).style.visibility = 'hidden'; 
document.getElementById(divsArray[1]).style.visibility = 'hidden'; 
document.getElementById(divsArray[2]).style.visibility = 'hidden'; 
document.getElementById(divsArray[3]).style.visibility = 'hidden'; 

NO odpowiedź do tej pory pracował (Ponieważ jestem pętli thru kodem ??)

rozwiązane poprzez ustawienie tylko poprzednio wyświetlanego widoczność slajdów do ukrytej

x = i; 
i = i+1; 

document.getElementById(divsArray[x]).style.visibility = 'hidden'; 

Answer 1

Jak o użyciem pętla:

for (var i = 0; i < 4; i++) { 
    document.getElementById(divsArray[i]).style.visibility = 'hidden'; 
} 

Answer 2

for (i=0;i<4;i++) { 
    document.getElementById(divsArray[i]).style.visibility='hidden'; 
} 

Answer 3

Wystarczy dostarczyć coś innego, rozwiązanie jQuery:

$(divsArray).each(function() { 
    $(this).css("visibility", "hidden"); 
}); 

Edit: Wygląda na to, że będziesz musiał zbierać referencje DOM pierwszy. (DivsArray jest naprawdę tylko tablicę z nazwiskami div, a nie same DIV?)

$(divsArray).each(function() { 
    $("#" + this).css({ "visibility": "hidden" }); 
}); 

Answer 4

To brzmi dla mnie, że nie może być więcej div ... Czy mogę zasugerować tę zmianę kodu Darin za:

for (var i = 0; i < divsArray.length; i++) { 
    document.getElementById(divsArray[i]).style.visibility = 'hidden'; 
} 

Answer 5

a oto jak to działa zarówno Prototype i Mootools:

$(divsArray).each(function(item) { 
    $(item).setStyle({visibility: "hidden"}); 
}); 

Answer 6

można umieścić następującą funkcję w tym samym/potomek zakresu divsArray.

function baka(idx) { 
    document.getElementById(divsArray[idx]).style.visibility = 'hidden'; 
} 

Następnie można wykonać jedną

baka(0); 
baka(1); 
baka(2); 
baka(3); 

lub

for (var i = 0; i < 4; i++) 
    baka(i); 

Wygląda to bezcelowe, ale jeśli masz więcej tablic tak, może chcesz zmodyfikować swoją funkcję tak:

function aho(arr, idx) { 
    document.getElementById(arr[idx]).style.visibility = 'hidden'; 
} 

i pętla przez dowolną tablicę:

for (var i = 0; i < divsArray.length; i++) 
    aho(divsArray, i); 

I nie, nie ma makr ani szablonów.

Answer 7

tak długo, jak my wszyscy palowania na wezmę najbardziej bezpośrednie podejście: D

document.getElementById(divsArray[0]).style.visibility = 
document.getElementById(divsArray[1]).style.visibility = 
document.getElementById(divsArray[2]).style.visibility = 
document.getElementById(divsArray[3]).style.visibility = 'hidden'; 

i po prostu iść na przekór:

var d = null, i = 0; 
while (d = document.getElementById(divsArray[i++])) { 
    d.style.visibility = 'hidden'; 
} 

Answer 8

nie mogłem "oprzeć się" wyzwaniu.Powiedziałbym dodać je do tej samej klasy i zrobić coś takiego (przykład prototyp):

$$('.className').invoke('setStyle', { 'visibility' : 'hidden' }); 

Answer 9

Możemy iteracyjne nad tablicę zawierającą id s Korzystanie Array.prototype.forEach() i ES6 za Arrow Functions:

var elemIds = ['two', 'four', 'six']; 
 

 
elemIds.forEach(id => {document.getElementById(id).style.visibility = 'hidden';});

<div id="one">One</div> 
 
<div id="two">Two</div> 
 
<div id="three">Three</div> 
 
<div id="four">Four</div> 
 
<div id="five">Five</div> 
 
<div id="six">Six</div> 
 
<div id="seven">Seven</div>