Maison  >  Article  >  interface Web  >  Comment définir la valeur img src en javascript

Comment définir la valeur img src en javascript

青灯夜游
青灯夜游original
2021-11-03 15:34:4715750parcourir

Méthode de paramétrage : 1. Utilisez l'attribut src de l'objet élément, la syntaxe "img element object.src="attribute value"" ; 2. Utilisez la méthode setAttribute(), la syntaxe "img element object.setAttribute(" src","valeur d'attribut")".

Comment définir la valeur img src en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

javascript définit la valeur img src

Méthode 1 : Utilisation de l'attribut src de l'objet élément

<!DOCTYPE html>
<html>
	<body>
		<img  src="img/1.jpg"    style="max-width:90%" / alt="Comment définir la valeur img src en javascript" >
		<p id="demo">点击按钮来改变img标签的内容。</p>
		<button onclick="myFunction()">试一下</button>

		<script>
			function myFunction() {
				var img = document.getElementsByTagName("img")[0];
				img.src = "img/2.jpg";
			}
		</script>
	</body>
</html>

Rendu :

Comment définir la valeur img src en javascript

Méthode 2 : Utilisation de setAttribute () méthode

La méthode setAttribute() ajoute l'attribut spécifié et lui attribue la valeur spécifiée. Si cette propriété spécifiée existe déjà, la valeur est uniquement définie/modifiée.

<!DOCTYPE html>
<html>
	<body>
		<img  src="img/1.jpg"    style="max-width:90%" / alt="Comment définir la valeur img src en javascript" >
		<p id="demo">点击按钮来改变img标签的内容。</p>
		<button onclick="myFunction()">试一下</button>

		<script>
			function myFunction() {
				var img = document.getElementsByTagName("img")[0];
				img.setAttribute("src","img/3.jpg"); 
			}
		</script>
	</body>
</html>

Rendu :

Comment définir la valeur img src en javascript

[Apprentissage recommandé : Tutoriel avancé javascript]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn