Astuce JavaScript : ajoutez un nombre aléatoire (ou une milliseconde) à tous les liens de la page

Question

J'ai une page HTML statique avec l'adresse https://MyPage/index.html

La page contient plusieurs images situées à https://MyPage/MyImages

Le lien vers l'image dans le code source HTML est le suivant :

……

Lorsque vous cliquez sur le bouton ou, mieux encore, la page se charge, tous les liens d'image doivent être réécrits en ajoutant un nombre aléatoire ou par exemple l'heure actuelle en millisecondes, pour que le lien ressemble à ceci :

……

Je pense qu'un point de départ possible peut être trouvé ici :

Modifiez tous les liens sur la page

Comment modifier tous les liens en utilisant javascript

Comment puis-je modifier chaque lien de la page vers du nouveau contenu ?

À partir de là, comment puis-je ajouter (au lieu d'une redirection constante) à l'exemple donné afin qu'un nombre aléatoire ou une durée en millisecondes soit ajouté à tous les liens d'image ?

Answer 1

const time_to_img = () => {
  document.querySelectorAll('img').forEach(e => {
    const dateStr = Date.now();
    const date = new Date(dateStr);
    e.src = e.src + '?' + date.getTime();
  })
}
window.addEventListener('load', time_to_img);

<img src="https://picsum.photos/id/1/300/200" alt="">
<img src="https://picsum.photos/id/7/300/200" alt="">
<img src="https://picsum.photos/id/12/300/200" alt="">
<img src="https://picsum.photos/id/22/300/200" alt="">

Dans la boucle vous avez calculé le temps en millisecondes puis vous l'avez ajouté après le src de chaque image ?

Maintenant, si vous souhaitez utiliser des nombres différents pour chaque image, vous devez ajouter quelque chose (nombres aléatoires ?). Ici, pour 4 images, toutes les opérations sont réalisées dans la même milliseconde.