include

---

SSI

SSIでの#include呼び出し

設定が終わっていない場合は.htaccessファイルに以下を追記
Options +Includes
AddType text/html .shtml
AddType text/html .html
AddOutputFilter INCLUDES .shtml
AddOutputFilter INCLUDES .html

javascript

javascriptで呼び出し

コードがhtmlファイルとは違う場合の文字化け対策は charset=”utf-8″ を追加

<div class="call" id="Call_C"></div>
<div class="call" id="Call_D"></div>
<script>
  document.addEventListener("DOMContentLoaded", function () {
  const noCache = (url) => `${url}?_=${new Date().getTime()}`;
  fetch(noCache("inc/call1.html"))
    .then((response) => response.text())
    .then((data) => {
      document.getElementById("Call_C").innerHTML = data;
    });
  fetch(noCache("inc/call2.html"))
    .then((response) => response.text())
    .then((data) => {
      document.getElementById("Call_D").innerHTML = data;
    });
});
  </script>

広告、計測用

html側
<script src="include.js"></script>

include.js側
document.write('<div class="inc_w1"><p>ここはincludeエリア<br />通常html版</p></div>');

jQuery

ajax で呼び出し

  <div class="call" id="Call_E"></div>
  <div class="call" id="Call_F"></div>
  <script>
     $(function () {
      $.ajaxSetup({ cache: false });
      $("#Call_E").load("inc/call1.html");
      $("#Call_F").load("inc/call2.html");
     });
  </script>

loadメソッド で呼び出し

$(function () の関数なしでも動く
ex : $(“#Call_B”).load(“inc/call2.html”);

<div class="call" id="Call_N"></div>
<script>
  $(function () {
    $("#Call_N").load("https://sdw.jp/work/inc/call1.html");
  });
</script>