Je suis novice en programmation html et javascript, mais si on m'explique lentement, je devrias comprendre
Je me suis inscrit sur ce forum car je n'ai pas trouvé la solution à mon problème.
Je m'excuse par avance si mon vocabulaire n'est pas hyper précis.
Je souhaite créer un document outil qui affiche de façon aléatoire une série de 5 images .jpg tirées au hasard dans 5 dossiers (qui contiennent une cinquantaine de photos).
Je me suis donc tourné vers une page html qui tournera en local.
J'ai réussi après quelques recherches à générer mes 5 images.jpg de façon aléatoire grâce à javascript.
Je voudrais maintenant les placer dans un tableau (table) dans mon document html afin de mettre un petit habillage : titre, commentaire etc. et pouvoir les poitionner comme je le souhaite sur différentes lignes.
Le problème que je rencontre c'est que je ne sais pas comment nommer l'image qui a été générée par javascript afin qu'elle soit affichée dans le table(au) html.
Voici où j'en suis :
mon fichier html
<HEAD>
<meta content="fr-ch" http-equiv="Content-Language">
<link href="style.css" rel="stylesheet" type="text/css">
</HEAD>
<body>
<h1> Situation </h1>
<div id="container">
<script type="text/javascript">
var imgA = document.createElement("img");
var randommoment = Math.floor((Math.random() * 7) + 1); // random entre 1 et 7
imgA.src = "moment/" + "moment" + randommoment + ".jpg" ;
imgA.classList.add('maclasse');
var imgB = document.createElement("img");
var randomautonomie = Math.floor((Math.random() *5) + 1); // random entre 1 et 5
imgB.src = "autonomie/" + "autonomie" + randomautonomie + ".jpg";
imgB.classList.add('maclasse');
var imgC = document.createElement("img");
var randomlieu = Math.floor((Math.random() *8) + 1); // random entre 1 et 8
imgC.src = "lieu/" + "lieu" + randomlieu + ".jpg";
imgC.classList.add('maclasse');
var imgD = document.createElement("img");
var randomsituation = Math.floor((Math.random() *19) + 1); // random entre 1 et 19
imgD.src = "situation/" + "situation" + randomsituation + ".jpg";
imgD.classList.add('maclasse');
var imgE = document.createElement("img");
var randomprofil = Math.floor((Math.random() *12) + 1); // random entre 1 et 12
imgE.src = "profil/" + "profil" + randomprofil + ".jpg";
imgE.classList.add('maclasse');
document.getElementById('container').appendChild(imgA);
document.getElementById('container').appendChild(imgB);
document.getElementById('container').appendChild(imgC);
document.getElementById('container').appendChild(imgD);
document.getElementById('container').appendChild(imgE);
</script></div>
</BODY>
Mon css :
.maclasse{
width:300px;
}
h1
{
font-size : 14 px;
face :georgia;
color: #090;
text-align: center;
margin-top: 0px;
}
Merci par avance pour votre aide, votre patience et votre pédagogie.
