前提・実現したいこと
現在ホームページの共通パーツをパターン1の様にhtmlファイルで作成してajaxで読み込むようにしています。
最近PHPを扱う様になりパターン2の様にPHPのechoでhtmlを出力出来る事を知りました。
それぞれメリットデメリットがあるかもしれないと考えたのですが、検索ワードが思いつかず今回の質問に至りました。
ajaxで下記のような形で共通パーツを呼び出した際のパターン1とパターン2のメリットデメリットをご教授頂ければと思います。
例:パターン1の方が読み込みが早い...etc
また、これ以外に共通パーツを読み込めるお勧めの方法や、質問方法などその他アドバイスがありましたら合わせてご教授頂けるとうれしいです。
該当のソースコード
js
1//パターン1 2function callHtml2(){ 3 $.ajax({ 4 url: "htmlcode.html", 5 cache: false, 6 async: false, 7 success: function(url){document.write(url);} 8 }); 9 $.getJSON("data.json", function(data){//記事の自動生成 10 for(var i in data){ 11 $("#list").append( 12 "<li>" + 13 "<h4>" + data["a"]."</h4>" + 14 "<img src='" + data["b"] + "'>" + 15 "</li>" 16 ); 17 } 18 }); 19} 20 21//パターン2 22function callHtml1(){ 23 $("#callHtml1").load("htmlcode.php"); 24}
html
1<!--htmlcode.html--> 2<h3>項目</h3> 3<p>文章</p> 4<ul> 5 <li><div><img src="hoge.png"></div> 6 <a href="#">.</a> 7 </li> 8...//固定のリスト複数個 9</ul> 10<ul id="list"></ul> 11
php
1<?php 2//htmlcode.php 3echo <<< EOM 4<h3>項目</h3> 5<p>文章</p> 6<ul> 7 <li><div><img src="hoge.png"></div> 8 <a href="#">.</a> 9 </li> 10//...固定のリスト複数個 11</ul> 12 13EOM; 14 15//動的リストの作成 16<h3>項目</h3> 17<p>文章</p> 18$url = "data.json"; 19$json = file_get_contents($url); 20$json = mb_convert_encoding($json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN'); 21$data = json_decode($json,true); 22if($data === NULL){ 23 return; 24}else{ 25 echo("<ul>"); 26 foreach ($data as $key => $val){ 27 echo("<li>"); 28 echo("<h4>".$data[$key]["a"]."</h4>"); 29 echo("<img src='".$data[$key]["b"]."'"); 30 echo("</li>"); 31 } 32 echo("</ul>"); 33} 34 35
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2018/02/19 15:42