Hoe afbeelding weergeven met JavaScript?

Ik probeer een afbeelding weer te geven via JavaScript, maar ik weet niet hoe ik dat moet doen. Ik heb volgende

function image(a,b,c)
{
  this.link=a;
  this.alt=b;
  this.thumb=c;
}
function show_image()
{
  document.write("img src="+this.link+">");
}
image1=new image("img/img1.jpg","dsfdsfdsfds","thumb/img3");

in HTML

<p><input type="button" value="Vytvor" onclick="show_image()" > </p>

Ik weet niet waar ik iets als image1.show_image();moet plaatsen.

HTML? Of ergens anders…


Antwoord 1, autoriteit 100%

Je zou gebruik kunnen maken van de Javascript DOM API. Kijk vooral naar de createElement()-methode.

Je zou een herbruikbare functie kunnen maken die een afbeelding maakt zoals deze…

function show_image(src, width, height, alt) {
    var img = document.createElement("img");
    img.src = src;
    img.width = width;
    img.height = height;
    img.alt = alt;
    // This next line will just add it to the <body> tag
    document.body.appendChild(img);
}

Dan zou je het zo kunnen gebruiken…

<button onclick=
    "show_image('http://google.com/images/logo.gif', 
                 276, 
                 110, 
                 'Google Logo');">Add Google Logo</button> 

Bekijk een werkend voorbeeld op jsFiddle: http://jsfiddle.net/Bc6Et/

Other episodes