Как в разные div'ы вставлять разные рандомные картинки?

Question

[Ilya Loopashko]

Есть код, который выдает рандомные картинки:

sha = Math.floor(Math.random() * 2);   
imagez = ('<img src="img/'+sha+'.png" border="0" />');
document.getElementById("imaaaga").innerHTML = imagez;3
document.getElementById("imaaaga2").innerHTML = imagez;

Как сделать, чтобы в html

<div>
  <div id="imaaaga"></div>
  <div id="imaaaga2"></div>
</div>

они менялись в каждом div'е по разному, а то получается, что одни и те же картинки повторяются.

Answer 1

[Михаил Шведков]

sha = function(){
return Math.floor(Math.random() * 2);   
}

ну и, соответственно,

document.getElementById("imaaaga").innerHTML = '<img src="img/'+sha()+'.png" border="0" />';
document.getElementById("imaaaga2").innerHTML = '<img src="img/'+sha()+'.png" border="0" />';

Answer 2

[Сергей Соколов]

В этой задаче хорошо бы генерить случайные числа без повтора максимально долго. Исчерпывать последовательность 0..n, в случайном порядке выдёргивая из этой «колоды» очередную карту. Когда колода пустеет, открываем новую.

Можно примерно так сделать функцию, которая будет выдёргивать из колоды случайную карту, и другой функцией генерить для неё картинку:

// Итератор случайных уникальных - Random Unique
function getRUIterator(max) {
  let buffer = [];
  
  const ruIterator = {
    next: function() {
      if (buffer.length === 0) { // если колода пуста
        for (let i = 0; i < max; i++) buffer.push(i); // открываем новую 0..max
      }

      const index = Math.floor(Math.random() * buffer.length);
      return buffer.splice(index, 1)[0]; // вынимаем из колоды случайную карту
    }
  }
  
  return ruIterator;
}

/**
 * генерим в каждый див по случайной картинке
 * как можно дольше без повторов
 * @param int iTotal число доступных картинок
 * @param Array массив строк - айдишки div'ов, куда вставлять
 */
function placeRandomImages(iTotal, aDivs) {  
  function placeImage(n, id) {
    const img = new Image();
    img.src = `img/${n}.png`;
    img.border = '0';
    document.getElementById(id).appendChild(img);
  }
  
  // будет генерить случайные неповторяющиеся
  const RUI = getRUIterator(iTotal);
  
  for (let i = 0; i < aDivs.length) {
    placeImage( RUI(), aDivs[i]);
  }
}

placeRandomImages(2, ["imaaaga", "imaaaga2"]);

Answer 3

[Алексей Ярков]

function getImage() {
  const random = Math.floor(Math.random() * 2);   
  return '<img src="img/'+random+'.png" border="0" />';
}

document.getElementById("imaaaga").innerHTML = getImage();
document.getElementById("imaaaga2").innerHTML = getImage();

Comments

[Сергей Соколов]

таки не исключаются коллизии – что оба раза выпадет одна и та же. Вероятность 1/3

[Ilya Loopashko]

Ну я думаю это не страшно, пару раз если будут, картинок со временем будет больше.