4

私はこの質問をするつもりでした(すでに質問されていることがわかるまで)そして今、その質問に対する答えがあります:

PHP スクリプトから JSON を要求し、その結果を JavaScript を使用して HTML にラップすることをお勧めします。

現在、ドキュメントに追加する JavaScript を使用して HTML を生成するという不幸なタスクがあり、これにどのようにアプローチするのが最善かわかりません。

PHP では、単純に HTML ファイルを保存しfile_get_contents()、正規表現を使用していくつかのトークンを関連情報に置き換えることができますが、JavaScript ではそれほど簡単ではないと思います。

私が考えたいくつかの方法:

  1. 反発的なアプローチ。大量の醜い文字列を生成し、それを追加します。

    var html = '<div class="comment">' +
        '<strong>' + author + '</strong>: ' +
        '<p>' + content + '</p>' +
    '</div>';
    
    $("#comments").append(html);
    
  2. 文字列をどこかに保存してから、正規表現を使用します。これは次のようになります。

    var commentHTML = '<div class="cmt"><strong>{auth}</strong>: {cmt}</div>';
    

これをうまく処理するライブラリ/プラグインはありますか? 文字列に格納された HTML のチャンクで JavaScript を混乱させることは、私が本当に避けたいことです。たぶん、私がPHPを使用して行っていると述べた方法と同様の方法がありますか? JavaScript は HTML ファイルを読み取り、コンテンツを文字列として保存できますか?

4

2 に答える 2

4

おめでとうございます、あなたはMustache.jsを発明しました。それをチェックしてください: https ://github.com/janl/mustache.js

var data = { author: "An Author", content: "Some content" };
var template = "<div class='cmt'><strong>{{author}}</strong>: {{comment}</div>";
var html = Mustache.render(template, data);
于 2012-04-12T03:33:58.480 に答える
4

テンプレートを任意のタイプのスクリプトとしてインライン化できます

<script id="my-template" type="template">
    <div class="comment">
        <strong>%s</strong>:
        <p>%s</p>
    </div>
</script>

「テンプレート」をドキュメントフラグメントに変換する関数を作成するのは簡単です

function fragment(html) {
    var args = arguments,
        div = document.createElement('div'),
        i = 1

    div.innerHTML = html.replace(/%s/g, function(){
        return String(args[i++])
    })

    return div.firstChild
}

それを使用することも簡単です

fragment(document.getElementById("my-template").textContent, author, comment)
于 2012-04-12T04:07:07.820 に答える