Ajouter une image dynamique dans document [Résolu]

[francis.c]

Bonjour, j'aimerais ajouter une image créée dynamiquement grâce à Javascript dans "document". Voici à quoi mon code ressemble pour le moment :

Code :

1
2
3
4
var img = new Image();
img.src = "../Images/taskbar_icons/chrome_mini_icon.png";
 
document.getElementById("taskbar_left").innerHTML += img;

Malheureusement, ce qui est ajouté au document n'est nul autre qu'une string "[object HTMLImageElement]". Comment dois-je m'y prendre ?

Merci d'avance,
Francis

[NoSmoking]

Bonjour,
passes par les méthodes standard d'intégration d'éléments dans un document

Code :

1
2
3
4
5
6
7
8
// recup objet destination
var oDiv = document.getElementById("taskbar_left")
// cretation image
var oImg = document.createElement('img');
//-- Ajout image
oDiv.appendChild( oImg);
//-- affecte l'image
oImg.src = "../Images/taskbar_icons/chrome_mini_icon.png"

[andry.aime]

Bonsoir
Remplace

document.getElementById("taskbar_left").innerHTML += img;

par

Code :

document.getElementById("taskbar_left").appendChild(img);

A+.

[francis.c]

Merci pour vos réponses, ça m'a bien aidé ! J'ai continué a développé un peu et puis je suis arriver à un autre problème. J'aimerais pouvoir savoir le ID de la div qui contient mon image. J'ai essayé avec parentNode mais tout ce que j'arrive à obtenir c'est le type de noeud (c'est-à-dire TD par exemple)

edit : C'est bon j'ai finalement trouvé, il suffisait de récupérer l'image en appelant getElementById à la racine du document, et ensuite remonter d'un niveau avec parentNode, puis parcourir c'est attribues :

Code :

img.parentNode.attributes.getNamedItem("id").value;

[NoSmoking]

pourquoi ne pas utiliser directement parentNode.id, ou si c'est un click sur l'image ajoutée autant stocker l'info à l'insertion

Code :

1
2
3
4
5
oImg.parentID = oDiv.id; // creation d'une propriete
oImg.onclick = function(){
  alert( this.parentID);       // 1st solution
  alert( this.parentNode.id);  // 2nd solution
}