チェ・ゲバムラの日記

脱犬の道を目指す男のブログ

【JS】共通ヘッダー、フッターをjQueryを利用して簡単に実装する

PHP、SSIなどが使えない、もしくはデータ納品だから先方で使えるかわからない場合に使える。
html 任意の箇所に埋める

<script type="text/javascript">
	writeHeader();
</script>

<script type="text/javascript">
	writeFooter();
</script>

JavaScript

//共通ヘッダーフッター読み込み
function writeHeader(){
	$.ajax({
		url:"/inc/header.html",
		cache:false,
		async:false,
		success:function(html){
			document.write(html);
		}
	});
}

function writeFooter(){
	$.ajax({
		url:"/inc/footer.html",
		cache:false,
		async:false,
		success:function(html){
			document.write(html);
		}
	});
}

inc/header.htmlとかにしてhtmlのパーツを入れるだけ。