JSでワンライナーテンプレート
どちらかというとTipsの類ですけれども。
JSコード上に、HTMLがあちこちにあるとどうしてもメンテしにくいので、
ファイルの分かりやすい場所に下記みたいなコードを用意しておきます。
var LIST = "<li><span title='No.=NUM='>Menu =NUM=</span></li>";
これを雛形として
for (var i=0; i<5; i++) { $(LIST.replace(/=NUM=/g, i)).appendTo("ul"); }
ループなんかで処理したりして
<ul> <li><span title="No.0">Menu 0</span></li> <li><span title="No.1">Menu 1</span></li> <li><span title="No.2">Menu 2</span></li> <li><span title="No.3">Menu 3</span></li> <li><span title="No.4">Menu 4</span></li> </ul>
こんなのが出力されます。
※みやすくなるよう整形してます
超単純ですが見た目すっきりするし、メンテしやすいので気に入ってます。
テンプレートエンジン使うほどじゃないなーって場面でよく使ってます。