使用 JavaScript 添加图像

Adding image with JavaScript

本文关键字:图像 添加 JavaScript 使用      更新时间:2023-09-26

长话短说,我需要使用 JavaScript 在给定 URL 的情况下将图像添加到 html5 游戏中。 问题是它位于一个名为gamemaker html5的程序内,该程序基本上是用于创建HTML游戏的拖放IDE。

我不知道任何JavaScript,只需要代码来添加给定URL的图像。 有人可以为我将以下html翻译成JavaScript吗?

<img src="http://www.mydomain.com/myimagefile.gif"></img>

这一切都包含在 html5 画布上,所以我需要能够将图像弹出到 x,y 坐标上。

要将图像添加到 GameMaker:HTML5 游戏,请使用以下命令:

newimg = sprite_add("http://www.mydomain.com/myimagefile.gif",1,false,false,0,0);

根据需要替换参数,但请注意,这不支持动画 GIF 文件 - 如果要导入动画精灵,它们必须是条带。

然后,newimg可以在您通常命名精灵的任何地方使用,例如:

draw_sprite(newimg,-1,32,32);

编辑:既然您已经指定要在画布上绘制此图像,这是一个完全不同的问题。 有关示例代码,请参阅此有关图像和画布的 MDN 教程。 另请参阅其他相关的 SO 问题。


在问题变成关于画布之前的先前答案。

这会将具有该 URL 的新图像附加到正文。 由于您可能希望将其放在比这更具体的地方,因此您还需要告诉我们您希望将图像插入页面的位置,以便document.body部分可以替换为页面中您希望新图像位于附近的所需元素。

var img = new Image();
img.src = "http://www.mydomain.com/myimagefile.gif";
document.body.appendChild(img);

这会将映像作为给定节点的最后一个子节点插入。 您还可以使用略有不同的代码在页面中给定对象之前或之后插入节点。