3

jQuery を使用して、定期的に複数レベルの HTML コードを動的に挿入する必要があります。私はこのように挿入する傾向があります：

$('#target').prepend('<div class="parent">' + 
    '<div class="child" data-id="' + someId + '">' + 
        '<h1>Some header</h1>' + 
        '<p class="info">' + someDynamicText + '</p>' + 
    '</div>' + 
    '<div class="sibling">' + someOtherInfo + '</div>' + 
'</div>');

もちろん、すべてが機能しますが、そのような HTML ブロックを挿入するためのより流動的な方法はあるのでしょうか? たぶん、jQueryにはある種のテンプレートシステムか何かが組み込まれています..ダンノ..ちょっと疑問に思っています

4

2 に答える 2

4

1 つの長い文字列を先頭に追加するのではなく、各要素を JavaScript 変数として構築します。

例えば：

var $parent = $("<div/>");
$parent.addClass("parent");

var $child = $("<div/>");
$child.addClass("child");
$child.data("id", someId);

var $h1 = $("<h1/>");
$h1.text("Some header");
$child.append($h1);

//etc.....

$parent.append($child);

$("#target").prepend($parent);
于 2013-07-29T11:21:29.687 に答える
0

MVVMのノックアウトjsなどのデザインパターンを管理するjqueryプラグインが多数あります...しかし、あなたの場合、単純で複雑ではないライブラリ呼び出しjQuery.tmplがあります

幸運を！

于 2013-07-29T11:29:04.883 に答える