Javascript сокращенный способ дублирования строк - PullRequest
7 голосов
/ 18 августа 2010

У меня есть этот код в функции, и я хочу сократить его - он применяет один и тот же стиль к каждому элементу в массиве.

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

НЕТ ответа на сегодняшний день (Поскольку я выполняю циклкод ??)

Разрешил, установив скрытую видимость только ранее показанного слайда

x = i;
i = i+1;

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

Ответы [ 9 ]

8 голосов
/ 18 августа 2010

Как насчет использования цикла:

for (var i = 0; i < 4; i++) {
    document.getElementById(divsArray[i]).style.visibility = 'hidden'; 
}
5 голосов
/ 18 августа 2010

Просто чтобы предложить что-то другое, решение jQuery:

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

Редактировать: Похоже, вам сначала придется собрать ссылки на DOM. (на самом деле divsArray - это просто массив имен div, а не самих div?)

$(divsArray).each(function() {
  $("#" + this).css({ "visibility": "hidden" });
});
4 голосов
/ 18 августа 2010

Вы можете поместить следующую функцию в тот же / потомок области видимости divsArray.

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

Тогда вы можете сделать либо

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

, либо

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

Это выглядит бессмысленно, но если у вас есть больше таких массивов, вы можете изменить свою функцию следующим образом:

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

и перебрать любой массив следующим образом:

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

И нет, здесь нет ни макросов, ни шаблонов.

4 голосов
/ 18 августа 2010

А вот как это работает в Prototype и Mootools :

$(divsArray).each(function(item) {
  $(item).setStyle({visibility: "hidden"});
});
4 голосов
/ 18 августа 2010

Мне кажется, что может быть больше div ... Могу ли я предложить это изменение в код Дарина:

for (var i = 0; i < divsArray.length; i++) {
   document.getElementById(divsArray[i]).style.visibility = 'hidden'; 
}
2 голосов
/ 18 августа 2010
for (i=0;i<4;i++) {
  document.getElementById(divsArray[i]).style.visibility='hidden';
}
1 голос
/ 18 августа 2010

Я не мог «противостоять» вызову.Я бы сказал, что вы добавляете их в один класс и делаете что-то вроде (пример прототипа):

$$('.className').invoke('setStyle', { 'visibility' : 'hidden' });
1 голос
/ 18 августа 2010

пока мы все копим, я выберу самый прямой подход: 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';

и просто пойти против зерна:

var d = null, i = 0;
while (d = document.getElementById(divsArray[i++])) {
    d.style.visibility = 'hidden';
}
0 голосов
/ 15 ноября 2017

Мы можем перебирать массив, содержащий id s, используя Array.prototype.forEach() и ES6 Функции стрелок :

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>
...