Nexus 9
PS4
Intuos Pro
Core i7-4790K
ページの先頭へ
トップに戻る
2013年10月25日 Web制作

【超シンプル】JavaScriptで画像をランダムに表示する方法


jsrandimgtJavaScript勉強中…
今JavaScriptを勉強しているんですが、どうせなら実用的なものを作ろうと思って「画像をランダムに表示するスクリプト」を作ってみました。

フォルダとファイルの構成はこんな感じで、imgフォルダ内に0.jpg~4.jpgという5枚の画像を配置されています。 jsrandimg

画像のランダム表示のみ

表示するだけなら超シンプルです。 numには画像の枚数を入れておきます。ファイル名を0から始まる連番にしなくてはいけないというのが少し面倒ですが、JavaScriptだけでファイル名を取得する方法が見つからない、というか出来ない?っぽいので仕方ないですね…

リンク付きのランダム画像表示

次にランダム表示された画像それぞれにリンクを付けてみます。 これでけっこう実用的になったんじゃないでしょうか?Amazonの商品紹介リンクに使えそうです。

とりあえずこれで終了ですが、もっとスマートな書き方があるかもしれません。そこはJavaScript初心者なので大目に見てください…
関連するかもしれない記事