如何使用JavaScript显示图像？ [英] How to display image with JavaScript?
问题描述
我试图通过JavaScript显示图像，但我无法弄清楚如何做到这一点。我有以下
函数图像（a，b，c）
{
this.link = a ;
this.alt = b;
this.thumb = c;
}
function show_image（）
{
document.write（img src =+ this.link +>）;
}
image1 =新图片（img / img1.jpg，dsfdsfdsfds，thumb / img3）;
in HTML
< p>< input type =buttonvalue =Vytvoronclick =show_image（）> < / p为H.
我无法弄清楚应该在哪里放置 image1.show_image （）; 。
HTML？或者别的什么地方......
你可以使用 Javascript DOM API 。特别是，请查看 createElement（）方法。
你可以创建一个可重用的函数来创建一个像这样的图像...
$ b $ pre $ function show_image（src，width，height，alt）{
var img = document.createElement（img）;
img.src = src;
img.width = width;
img.height = height;
img.alt = alt;
//下一行只会将它加到< body>标记
document.body.appendChild（img）;
}
然后您可以像这样使用它...
< button onclick =
show_image（'http://google.com/images/logo.gif'，
276，
110，
'Google徽标'）;>添加Google徽标< / button>
查看jsFiddle上的工作示例： http://jsfiddle.net/Bc6Et/
I am trying to display image, through JavaScript, but i can't figure out how to do that. I have following
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>
I can't figure out where should I put something like image1.show_image();.
HTML? Or somewhere else...
You could make use of the Javascript DOM API. In particular, look at the createElement() method.
You could create a re-usable function that will create an image like so...
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);
}
Then you could use it like this...
<button onclick=
"show_image('http://google.com/images/logo.gif',
276,
110,
'Google Logo');">Add Google Logo</button>
See a working example on jsFiddle: http://jsfiddle.net/Bc6Et/
这篇关于如何使用JavaScript显示图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
