EJSを使用して画像をレンダリングする方法

方法1: 静的な画像のレンダリング

<img src="/path/to/image.jpg" alt="Image">

上記のコードでは、/path/to/image.jpgの部分を実際の画像ファイルのパスに置き換えます。これにより、指定したパスの画像がレンダリングされます。

方法2: 変数を使用した画像のレンダリング EJSでは、変数を使用して画像のパスを動的に指定することもできます。例えば、サーバー側で定義されたimagePathという変数を使用する場合、以下のように書きます。

<img src="<%= imagePath %>" alt="Image">

このコードでは、<%= imagePath %>の部分が変数の値に置き換えられ、その値が画像のパスとして使用されます。

方法3: ループを使用した画像のレンダリング もし複数の画像を表示する必要がある場合、ループを使用して繰り返し画像をレンダリングすることもできます。例えば、サーバー側で定義されたimageListという配列がある場合、以下のように書きます。

<% imageList.forEach(function(image) { %>
  <img src="<%= image.path %>" alt="<%= image.alt %>">
<% }); %>

このコードでは、imageList配列内の各要素に対してループが行われ、各要素のpathとaltプロパティが画像のパスと代替テキストとして使用されます。

これらの方法を使って、EJSを使用して画像をレンダリングすることができます。必要に応じて、サーバーサイドのデータを動的に組み込むこともできます。