Adding an img element to a div with javascript

Question

I am trying to add an img to the placehere div using JavaScript  however I am having no luck  Can anyone give me a hand with my code    lt html gt   lt script type  text javascript  gt  var elem   document createElement  img    elem setAttribute  src    images hydrangeas jpg    elem setAttribute  height    768    elem setAttribute  width    1024    elem setAttribute  alt    Flower    document getElementById  placehere   appendChild  elem     lt  script gt   lt body gt    lt div id  placehere  gt    lt  div gt    lt  body gt   lt  html gt

User · Accepted Answer

document getElementById  placehere   appendChild elem     not  document getElementById  placehere   appendChild  elem      and use the below to set the source  elem src    images hydrangeas jpg

User · Answer

It should be   document getElementById  placehere   appendChild elem     And place your div before your javascript  because if you don t  the javascript executes before the div exists  Or wait for it to load  So your code looks like this    lt html gt    lt body gt   lt script type  text javascript  gt  window onload function    var elem   document createElement  img    elem setAttribute  src    http   img zohostatic com discussions v1 images defaultPhoto png    elem setAttribute  height    768    elem setAttribute  width    1024    elem setAttribute  alt    Flower    document getElementById  placehere   appendChild elem      lt  script gt   lt div id  placehere  gt    lt  div gt    lt  body gt   lt  html gt    To prove my point  see this with the onload and this without the onload  Fire up the console and you ll find an error stating that the div doesn t exist or cannot find appendChild method of null

User · Answer

The following solution seems to be a much shorter version for that    lt div id  imageDiv  gt  lt  div gt    In Javascript   document getElementById  imageDiv   innerHTML     lt img width  100  height  100  src  images hydrangeas jpg  gt

User · Answer

function image           dynamically add an image and set its attribute     var img document createElement  img        img src  p1 jpg      img id  picture      var foo   document getElementById  fooBar        foo appendChild img       lt span id  fooBar  gt  amp nbsp  lt  span gt

[javascript] Adding an img element to a div with javascript

Examples related to javascript

Examples related to dom