it-swarm-id.com

Menambahkan elemen img ke div dengan javascript

Saya mencoba menambahkan img ke _ placehere div menggunakan JavaScript, namun saya tidak beruntung. Adakah yang bisa membantu saya dengan kode saya?

<html>
<script type="text/javascript">
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");
</script>
<body>

<div id="placehere">

</div>

</body>
</html>
59
Andrew De Forest
document.getElementById("placehere").appendChild(elem);

tidak

document.getElementById("placehere").appendChild("elem");

dan gunakan di bawah ini untuk mengatur sumbernya

elem.src = 'images/hydrangeas.jpg';
67
Ghyath Serhal

Harus:

document.getElementById("placehere").appendChild(elem);

Dan tempatkan div Anda di depan javascript Anda, karena jika tidak, javascript dijalankan sebelum div tersebut ada. Atau tunggu sampai dimuat. Jadi kode Anda terlihat seperti ini:

<html>

<body>
<script type="text/javascript">
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);
}
</script>
<div id="placehere">

</div>

</body>
</html>

Untuk membuktikan maksud saya, lihat ini dengan onload dan ini tanpa onload . Jalankan konsol dan Anda akan menemukan kesalahan yang menyatakan bahwa div tidak ada atau tidak dapat menemukan metode appendChild dari nol.

18
Some Guy
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);
}

<span id="fooBar">&nbsp;</span>
4
hema