JavaScriptの変数配列からHTMLイメージにランダムイメージを生成するにはどうすればよいですか？

これは私がこれまで私のHTMLページとJavaScriptページで持っていたものですが、私は自分のプロジェクトフォルダに画像を持っているので、JavaScriptファイルでURLを使いたくありません。しかし、私がhtmlを開くと、画像がポップアップしません。私はまた、背景イメージを望んでいません。JavaScriptの変数配列からHTMLイメージにランダムイメージを生成するにはどうすればよいですか？

var images = ["img/1.jpg", "img/2.jpg", "img/3.jpg", "img/4.jpg", "img/5.jpg", "img/6.jpg"]; 
 

 
var randomName = images[Math.floor(Math.random() * images.length)]; 
 

 
document.getElementById("randomImage").style.backgroundImage = "url('http://angelinawong.com/" + randomName + "')";

<!DOCTYPE html> 
 
<html> 
 
<head><title>47</title></head> 
 
<body> 
 
    <div id="randomImage"/> 
 
    
 
    <script type="text/javascript" src="jquery-3.2.1.min.js"></script> 
 
    <script src="popup.js"></script> 
 
</body> 
 
</html>

出典

2017-09-10 Angelina

私は、画像のURLが正しいことを確認し、JavaScriptの一部に何か問題が表示されない（これらはすべてどこを指している）と要素がいくつかの最小の幅と高さを持ちます。 – alou

これらのURLに存在しない画像以外は正常に動作しているようです。 – adeneo

@adeneo画像名が '1'で始まるので、' randomName + 1'も必要ないでしょうか？しかし、あなたは '/ img' URLが正しく動作していないのは間違いありません。私も彼らを試しました。 – 82Tuskers

bodyタグの後にスクリプトタグを配置してみ、それはHTMLとJSがロードされているために問題がある可能性があります。

<!DOCTYPE html> 
<html> 
<head><title>47</title></head> 
<body> 
<div id="randomImage"/> 
</body>  
<script type="text/javascript" src="jquery-3.2.1.min.js"></script> 
<script src="popup.js"></script> 
</html>

出典

2017-09-10 18:57:51

ありがとうDan！私はそれが問題だと思っていますが、今私はそれらのイメージをどのように生成するかを考え出すのに困っています。私はURLを使いたくないので、 "url"をプロジェクトフォルダのパスに置き換える方法はありますか？ – Angelina

@Angelinaあなたの 'index.html'が存在する場所から相対URLを使うことができます。 –

JavaScriptの変数配列からHTMLイメージにランダムイメージを生成するにはどうすればよいですか？

答えて

関連する問題