JavaScriptで画像の配列を出力する

-1

私はJavaScriptを初めて使っています。私はこのコードを作ったのです。このコードの目的は、JavaScriptとHTMLを使用してウェブサイト内の画像のARRAYを表示することです。彼らはすべてすぐに表示する必要があります。これまでのコードですが、動作しません。JavaScriptで画像の配列を出力する

<html> 
<head> 
<script> 
     var ArrayOfImages = []; 

     var Image1 = new Image1() 
     image1.src = "image1.jpg"; 

     var Image2 = new Image2() 
     Image2.src = "image2.jpg"; 

     var Image2 = new Image3() 
     Image3.src = "image3.jpg"; 

     ArrayOfImages.push(Image1); 
     ArrayOfImages.push(Image2); 
     ArrayOfImages.push(Image3); 
     ArrayOfImages.toString(); 
     document.write(ArrayOfImages); 
</script> 
</head> 
<body> 
</body> 
</html>

このコードを実行すると、空のWebページが表示されます。

不思議なことに、画像はhtmlファイルと同じファイルにあります。 JavaScriptやHTMLも比較的新しいので、修正方法を明確にしてください。 Fiddle

UPDATE

することができますアル：

出典

2017-02-19 A.Ridley

は 'Image1,2,3..'クラス（オブジェクト）がありますか？ –

これらはすべて 'new Image（）'であり、body要素に追加する必要があります。 'Document.Write（）'は文字列を本文に書き出すためのものです。必要なヘルプについては、[この質問]（http://stackoverflow.com/questions/2735881/adding-images-to-the-html-with-javascript）をご覧ください。 – Archer

あなたはそれが何を意味するか分かりません。私はjavascriptで人々を助けるウェブサイトからコードの一部を得た。私はこれらの画像1,2,3を使用しました。変数の名前です。私はあなたに多くの助けをしなかった場合は申し訳ありません。 –

あなたはその後、appendこの

var ArrayOfImages = ['image1.jpg', 'image2.jpg', 'image3.jpg']; //your assumed array 
 
ArrayOfImages.forEach(function(image) { // for each link l in ArrayOfImages 
 
    var img = document.createElement('img'); // create an img element 
 
    img.src = image;       // set its src to the link l 
 
    document.body.appendChild(img);   // append it to the body 
 
});

参照フィドルbody.Likeの各配列項目をarray.forEachを使用する必要がありますそのため、以下のようにheightとwidthを設定してください。

var ArrayOfImages = ['https://upload.wikimedia.org/wikipedia/commons/f/f9/Wiktionary_small.svg', 'https://upload.wikimedia.org/wikipedia/commons/f/f9/Wiktionary_small.svg', 'https://upload.wikimedia.org/wikipedia/commons/f/f9/Wiktionary_small.svg']; //your assumed array 
 
ArrayOfImages.forEach(function(image) { 
 
    var img = document.createElement('img'); 
 
    img.src = image; 
 
    img.height = "45"; 
 
    img.width = "50"; 
 
    document.body.appendChild(img); 
 
});

出典

2017-02-19 13:05:35

あなたがやったことをコピーしましたが、まだ空のページがあります。これは今私のコードです。 –

\t \t \t \t \t \t \t \t \t –

イメージの正しいパスを定義します。 –

JavaScriptで画像の配列を出力する

答えて

関連する問題