0

HTML：

<img src="person.png" id="person"/>

JavaScript：

var object0 = document.getElementById("person");
var i = 0;

context.drawImage(object0, object0X, object0Y);// this works

context.drawImage("object" + i, object0X, object0Y);// this doesn't

错误信息：

Could not convert JavaScript argument arg 0 [nsIDOMCanvasRenderingContext2D.drawImage]

我在某处读到，我收到错误的原因是它必须是 DOM 元素，而不是字符串。好吧，我需要运行一个 for 循环，这样我才能影响屏幕上的多个对象，因此需要进行一些连接。我可以使用类似于 parseInt() 的东西吗？

4

3 回答 3

2

使用字符串文字引用变量将导致错误，因为它将评估为字符串文字。

var Object0 = document.getElementById('person'); // typeof 'object'
console.log(typeof ('Object' + i)); // This will output 'string' to the console

您可以改为创建一个对象，其属性包含对 DOM 元素的引用。

var images = {
    Object0: document.getElementById('person')
    // and so forth...
};

这非常有用，因为您可以使用括号表示法来引用每个属性。现在，您可以使用 for 循环遍历属性并访问值；像这样：

for (var i = 0; i < images.length; i++) {
    context.drawImage(images['Object' + i], Object0X, Object0Y); // This works
    console.log(typeof images['Object' + i]); // This will output 'object' to the console
}
于 2012-04-18T18:52:35.383 回答
0

我想你想做：

context.drawImage(document.getElementById("object" + i), object0X, object0Y);

这将要求您具有带有 ids object0, object1, object2...的图像元素

于 2012-04-18T17:26:05.657 回答
0

您不能通过字符串引用 JS 变量。该错误源于将字符串传递给 drawImage 函数，而不是对图像的引用。只需将变量传递给函数，它就可以工作。

于 2012-04-18T17:30:32.947 回答