Maison > Article > interface Web > Comment définir le contenu img en javascript

Comment définir le contenu img en javascript

青灯夜游original: 2021-07-26 18:28:535884parcourir

Le contenu de la balise img est principalement contrôlé par l'attribut src. En JavaScript, vous pouvez utiliser la méthode setAttribute() pour définir la valeur de l'attribut src de la balise img, puis définir le contenu img. "élément img object.setAttribute("src","valeur d'attribut ")".

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

Comment définir le contenu img en javascript définit une image dans une page HTML. La balise

Comment définir le contenu img en javascript a deux attributs obligatoires : src et alt.

L'attribut src de la balise src est obligatoire. Il précise l'URL de l'image.

Lorsqu'une page Web se charge, le navigateur récupère l'image du serveur Web et l'insère dans la page. Par conséquent, assurez-vous que l’image se trouve au même endroit que la page Web concernée, sinon les visiteurs pourraient obtenir une icône de lien rompu. Si le navigateur ne trouve pas l'image, il affichera une icône de lien rompu.

javascript définit le contenu img

En javascript, vous pouvez utiliser la méthode setAttribute() pour définir le contenu img. 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.

Exemple :

<!DOCTYPE html>
<html>
<body>

<img  src="img/1.jpg"    style="max-width:90%"/ alt="Comment définir le contenu img en javascript" >

<p id="demo">点击按钮来改变img标签的内容。</p>

<button onclick="myFunction()">试一下</button>

<script>
function myFunction()
{
document.getElementsByTagName("img")[0].setAttribute("src","img/2.jpg"); 
}
</script>

</body>
</html>

Rendu :

Comment définir le contenu img 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!

JavaScript html 对象

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

Article précédent：Comment convertir une valeur en type int en javascriptArticle suivant：Comment convertir une valeur en type int en javascript

Articles Liés

Voir plus