0

HTMLで多くの画像を表示するときに必要なコードの量を減らす方法があるかどうか疑問に思っていますか？

ギャラリーに約2〜300枚の画像を表示したいのですが、現時点ではHTMLは次のようになります。

<div id="scroller>
    <img src="/Content/images/decking/decking-1.jpg" width="100" alt="" />
    <img src="/Content/images/decking/decking-2.jpg" width="100" alt="" />
    <img src="/Content/images/decking/decking-3.jpg" width="100" alt="" />
    <img src="/Content/images/decking/decking-4.jpg" width="100" alt="" />
    <img src="/Content/images/decking/decking-5.jpg" width="100" alt="" />
</div>

...しかし、画像「decking-250.jpg」まで。

250行以上の「imgsrc」HTMLがないように画像を表示するより効率的な方法はありますか？

変更されるファイル名の唯一の部分は、「-1」、「-2」、「-3」などです。Altタグを含む残りの部分は、空のままにすることができます。

ASP.netオンラインチュートリアルをガイドとして使用して、ASP.Net MVC3 Razorでこのサイトを構築しています。解決策が思い浮かぶ場合は、その方法で行う必要がある場合は、それでも問題ありません。学ぶために考慮すべき別のアプローチがありましたか？

よろしくお願いします。

4

2 に答える 2

1

これが HTML の仕組みです。img画像ごとに1 つのタグが必要なため、これを減らすことはできません。そのコードは、PHP、JS などを介して動的に作成できます。しかし、最終的には、タグの長いリストが得られ、img他のタグによって個別にラップされている可能性があります (たとえば、リスト内)。

于 2012-07-02T10:42:25.993 に答える
1

私は Feela に同意します。冗長に見えるかもしれませんが、あなたのコードはほぼ防弾仕様です。それでも、JS のようなものを使用できる (または既に使用している) 場合は、選択肢があります。これはテストされていませんが、コードを圧縮できる Jquery/Javascript で for ループ ステートメントを設定できます。例えば：

for (i=1; i < 250; i++) {
    $('#scroller').append('<img src="/Content/images/decking/decking-' + i.toString() + '.jpg" width="100" alt="" />');
}

私は ASP コーダーではありませんが、おそらく機能的に似たものを提供します。

于 2012-07-02T12:20:04.383 に答える