javascript - 1行创建一个新的Image()

现在，我正在使用

var lifeIcon = new Image();
lifeIcon.src = "img/System/lifeIcon.png";

有没有办法在一行中做同样的事情？

我试过了

var lifeIcon = (new Image()).src = "img/System/lifeIcon.png";

但这是行不通的。 lifeIcon被视为字符串...

谢谢。

注意：我有很多张图片。我的目标是在画布上使用图像。
例如：ctx.drawImage(lifeIcon,0,0)



解：

function newImage(src){
    var tmp = new Image();
    tmp.src = src;
    return tmp
}

var lifeIcon = newImage("img/System/lifeIcon.png");
var closeIcon = newImage("img/System/closeIcon.png");
var goldIcon = newImage("img/System/goldIcon.png");
...

注意：我个人觉得这样写起来更快，读起来也更快，特别是因为我有很多图像。

最佳答案

这取决于您接下来要做什么。如果您仅需要附加其他内容，则可以执行以下操作：

element.appendChild(new Image()).src = "img/System/lifeIcon.png";

之所以可行，是因为.appendChild()返回新添加的元素。



如果您需要分配其他属性，那么您可能只想创建一个帮助器函数，使您可以传递包含属性和值的对象。

function create(name, props) {
    var elem = document.createElement(name);
    for (var p in props)
        elem[p] = props[p];
    return elem;
}

这是一个非常简单的功能，可以扩展一点，但是您明白了。

var el = create("img", {src: "img/System/lifeIcon.png"});