javascript - js読み込み画像

Question

私はこのコードを持っています

    var a = new Image();
    a.src = objects.a.image;

    var b = new Image();
    b.src = objects.b.image;

    var x = new Image();
    x.src = objects.x.image;

このような画像が約 10 個ありますが、それを変数にロードするより良い方法はありますか?

Answer 1

これはうまくいくはずです

for(var i in objects)
{
    if(objects[i].image)
    {
        var oImage = new Image();
        oImage.src = objects[i].image;
        // if you need the Image object you can store it somewhere
        objects[i].oImgObject = oImage;
     }
}

Answer 2

画像だけが含まれていると仮定objectsして、これを試してください：

var imageList = [];
for (var i in objects) {
    var obj = objects[i];
    var img = new Image();
    img.src = obj.image;
    imageList.push(img);
}

Answer 3

オブジェクト オブジェクトのプロパティを反復処理できます。オブジェクトのプロパティのソースを指定して、反復ごとに新しい画像を作成します。次に、それを配列に追加します。

デモ

var arrayOfImg = [];

for(var propt in objects){
    var image = new Image();
    image.src = objects[propt].image;
    arrayOfImg.push(image)
}

console.log(arrayOfImg);

Answer 4

通常、配列を使用して画像を保存します。

例えば ​​：

var arr = [];
for (var c='a'.charCodeAt(0); c<='x'.charCodeAt(0); c++) {
     var img = new Image();
     img.src = objects[String.fromCharCode(c)].image;
     arr.push(img);
}

それらを変数としてグローバル コンテキストに追加する必要がある場合は、次のようにします。

for (var c='a'.charCodeAt(0); c<='x'.charCodeAt(0); c++) {
     var img = new Image();
     var name = String.fromCharCode(c);
     img.src = objects[name].image;
     window[name] = img; // better use somthing's else than window...
}

が実際に何であるかによってはobjects、より簡単な解決策があるかもしれないことに注意してください。