2

画像オブジェクトの配列を作成しようとしていますが、苦労しています。各オブジェクトは、画像と画像のキャプションを保持します。

次のコードは、確認のために Firebug に貼り付けると正常に動作します。

例 1

var imageArray = new Array();

imageArray[0] = new Image();
console.log(imageArray[0]);  //result is <img>

imageArray[0].src = "my-image-01.png";
console.log(imageArray[0]); // result is <img src="my-image-01.png"/>

imageArray[0] = {imageCaption: "A caption for the image"};  //an object
console.log(imageArray[0].imageCaption) //result is: A caption for the image

imageArray[1] = new Image()

...など

ただし、次のほうが理にかなっていると思いましたが、エラーがスローされ続け、その理由がわかりません。

例 2

var imageArray = new Array();

imageArray[0]= {
    image01: new Image(),
    image01.src: "my-image-01.png",  //"SyntaxError: missing : after property id"
    imageCaption: "An image caption"
    };

imageArray[1] = {
    image02: new Image().
    image02.src: "my-image-02.png",
    imageCaption: "Another image caption"
    }

上記のコードの何が問題なのか、誰か説明できますか? 私が投稿した最初の例は、私が使用すべきアプローチですか? どうもありがとう

4

5 に答える 5

6

あなたの最善の策は、一種のファクトリと.push画像配列を使用することです。

このようなことを試してください

// Image factory
var createImage = function(src, title) {
  var img   = new Image();
  img.src   = src;
  img.alt   = title;
  img.title = title;
  return img; 
};

// array of images
var images = [];

// push two images to the array
images.push(createImage("foo.jpg", "foo title"));
images.push(createImage("bar.jpg", "bar title"));

// output
console.log(images);

出力

[
  <img src=​"foo.jpg" title=​"foo title" alt="foo title">​, 
  <img src=​"bar.jpg" title=​"bar title" alt="bar title">​
]
于 2013-10-13T23:30:17.863 に答える