1

ユーザーがアイテムのリストを表示できるようにする PHP Web アプリケーションを実行しています。

最低限のサイトでは、PHP を使用して HTML を記述し、検索結果を表示します。

<body>
   <?php
      foreach($results as $item) {
         echo "<div class='item'>".
                 "<img src='images/items/".$item['imageName'].".png' />".
                 "<span class='itemDescription'>".$item['text']."</span>".
              "</div>";
      }
    ?>
 </body>

ただし、Javascript が有効になっている場合は、AJAX を使用して結果を表示します。

function fireSearch(query) {
   $.post("ajax/search.php", {q: query}, function(items) {
      for (var i in items) {
         $("body").append(
             "<div class='item'>"+
                "<img src='images/items/"+items[i]['imageName']+".png' />"+
                "<span class='itemDescription'>"+items[i]['text']+"</span>"+
             "</div>";
      }
   }
}

PHP 関数を呼び出しget_item_html($item)て、AJAX 要求がクリーンな HTML を返すようにし、それを DOM に配置するだけで済みますが、要求が大量の結果を返すと、実際に HTML を作成する必要があるときに、帯域幅の無駄遣いになります。とimageNameですtext

これは私が対処しなければならないことですか、それともエレガントな解決策がありますか?

また、この問題には名前が付いているので、Google で検索できますか?

4

3 に答える 3

1

はい、わかった。

私が見つけた最善の解決策は、Mustacheを使用し、いくつかのテンプレートを作成し、JavascriptとPHPの両方でテンプレートを読み取ることです。

MustacheライブラリはPHPJavascriptの実装を提供するため、心配する必要はありません。

  1. .mustacheいくつかのテンプレートを作成する
  2. PHPでは、ライブラリが提供するクラスとメソッドを使用してHTMLとechoそれを作成します
  3. Javascriptでは、mustache.jsスクリプトを追加してテンプレートを使用し、ページで使用されるすべてのテンプレートに、次のように作成されたテンプレートファイルの内容を含むスクリプトタグを追加しますecho
    <script id="arbitraryID" type="text/mustache">
    <?php echo file_get_contents(__DIR__."/templates/myTmpl.mustache"); ?>
    </script>
    テンプレートは、(jQueryスタイル)を実行して使用できます。
    var tmpl = $("#arbitraryID").html();

これがこの質問を開いていると思う人に役立つことを願っています...

于 2013-02-19T00:17:31.703 に答える
0

ajax 関数に json ビルドを返させてから、サイズを抑えるために .append() をカスタムの最小化された関数にすると、結果として多くのクリーンなコードが得られます。

于 2013-02-18T11:12:56.450 に答える