sample: loto7 simulator

HTML

<div id="loto7"></div>

JavaScript

//一旦配列に全ての数値を格納
var numArr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37];

//配列内の要素をランダムに並べ替える(関数は後述)
numArr = shuffle(numArr);

//先頭から欲しい数だけ取り出す
var loto7 = numArr.slice(0, 7);

//--------------------
//(ここまでが、重複の無い任意の数の乱数を得る、定番の方法)
//--------------------

//Array.sortで昇順に並べ替え
loto7.sort(function(a, b) {
	return a - b;
});

//配列の数字を先頭から順に使い、img要素を生成し挿入
for(var i = 0; i < loto7.length; i++) {
	var img = new Image();
  img.src = loto7[i] + ".png";  //画像のパス
  img.alt = loto7[i];           //alt属性
  document.getElementById("loto7").appendChild(img);
}

//配列をランダムに並べ替える関数
//以下のURLから拝借(同様の例が検索すればたくさん出てきます)
//https://hail2u.net/blog/coding/shuffle-array-in-javascript.html
function shuffle(list) {
  var i = list.length;

  while (--i) {
    var j = Math.floor(Math.random() * (i + 1));
    if (i == j) continue;
    var k = list[i];
    list[i] = list[j];
    list[j] = k;
  }

  return list;
}