Remplacer les noms d'image HTML par javascript

Je cherche une solution pour remplacer une partie de l'URL de l'image par du JavaScript pur mais regex me donne des maux de tête. La page charge dynamiquement des images de taille normale "_S2". Cependant, je voudrais passer toutes les images à des versions plus grandes "_S3".
Comment faire pour basculer tous les noms d'image de page de _S2 à _S3 avec JS?Remplacer les noms d'image HTML par javascript

<body> 
<script> 

</script> 
<img src="0330907_PE520866_S2.JPG" /> 
<img src="0349454_PE535816_S2.JPG"/> 
</body>

Source

2015-11-17 Teme

Pouvez-vous poster vos essais? (le code que vous avez déjà trouvé) –

Astuce: ne mettez pas la balise '

Obtenez toutes les images et utiliser le remplacer pour chaque image:

var images = document.getElementsByTagName('img'); 

for(var i = 0; i < images.length; i++) { 
    var image = images[i]; 
    image.src = image.src.replace('_S2', '_S3'); 
}

Source

2015-11-17 10:07:08

Utilisez replace

JsFiddle Demo

Sélectionnez toutes les images dont src se termine par _S2.JPG l'aide du sélecteur img[src$="_S2.JPG"] et querySelectorAll
Boucle sur les images et remplacez _S2 par _S3 à partir de la source d'image et mettez à jour la valeur src.

code:

document.addEventListener("DOMContentLoaded", function() { 
    var images = document.querySelectorAll('img[src$="_S2.JPG"]'); 

    for (var i = 0; i < images.length; i++) { 
     images[i].src = images[i].src.replace('_S2', '_S3'); 
    } 
});

Voir https://developer.mozilla.org/en/docs/Web/CSS/Attribute_selectors pour sélecteurs.

Source

2015-11-17 10:07:58 Tushar

Salut, cela semble fonctionner très bien! Cependant, j'ai remarqué que le script doit être inséré après les images pour le faire fonctionner. Comment implémenter le code à charger après les images si je n'ai pas accès à la section pied de page de la page à cause du système CMS? J'ai aussi des problèmes pour cibler le changement de div id "imgThmProduct". This is test image – Teme

@Teme Enveloppez le code dans [DOMContentLoaded] (https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded) ou [onload] (https://developer.mozilla.org/en -US/docs/Web/Events/load) ou déplacez le script à la fin de '' – Tushar

DOMContentLoaded a fonctionné correctement! J'apprécie pour votre aide rapide! – Teme

Remplacer les noms d'image HTML par javascript

Questions connexes