将图像对象作为函数和类参数传递答案

【问题标题】：Passing image objects as Function & Class Arguments将图像对象作为函数和类参数传递
【发布时间】：2019-03-02 04:08:25
【问题描述】：

如何在函数/类中将图像作为参数传递，或者这是不可能的，如果是，我将如何解决它？例如：

var tree = new Image();
tree.src = "img/statobj/tree.png"
function additem(dimage){
document.getElementById("myitems").rows[0].insertCell(0).innerHTML ='<div id="invetoryitem" >'+ this.dimage + '</div>'
console.log(dimage) //gets undefined
}

我尝试了 dimage.src 和其他方法，但我使用的任何方法似乎都不起作用：/

【问题讨论】：

IIRC function(dimage) 语法无效
对不起，这只是一个例子，这不是我的实际问题，我会解决它

标签： javascript html string function ecmascript-6

【解决方案1】：

像其他任何方式一样传递它，但要显示它，请使用 appendChild 而不是 innerHTML：

var tree = new Image();
tree.src = "https://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/Ash_Tree_-_geograph.org.uk_-_590710.jpg/220px-Ash_Tree_-_geograph.org.uk_-_590710.jpg";
function showTree(dimage) {
  document.getElementById("div").appendChild(dimage);
  console.log(dimage);
}

showTree(tree);

&lt;div id="div"&gt;&lt;/div&gt;

如果您确实想使用innerHTML，请创建一个<img>，其中src 为dimage.src：

var tree = new Image();
tree.src = "https://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/Ash_Tree_-_geograph.org.uk_-_590710.jpg/220px-Ash_Tree_-_geograph.org.uk_-_590710.jpg";
function showTree(dimage) {
  document.getElementById("div").innerHTML = "<img src='" + dimage.src + "'>";
  console.log(dimage);
}

showTree(tree);

&lt;div id="div"&gt;&lt;/div&gt;

【讨论】：

【解决方案2】：

您必须命名函数并通过将图像作为参数传递来调用它。如果您使用innerHTML，则必须创建图像标签并将接收到的图像的来源作为参数添加到函数中

var tree = new Image();
tree.src = "img/statobj/tree.png"
function a(dimage){
document.getElementById("myitems").innerHTML ='<div id="invetoryitem" ><img src="'+dimage.src+ '"></div>'
console.log(dimage) //gets undefined
}
a(tree);

&lt;body id="myitems"&gt;&lt;/body&gt;

【讨论】：