ホームページ作成ガイド

ひとつのソースを使い回す

【demo.html】
<HTML><HEAD><TITLE>ひとつのファイルからソースを呼び出す</TITLE></HEAD>
<BODY>

<Script Language="JavaScript" src="header.js"></Script>

</BODY></HTML>

【header.js】
document.write("<table border='0' cellspacing='0' cellpadding='0' width='100%' height='131' background='head_bk.gif'><tr><td><a href='http://www.salut.ne.jp/'><IMG SRC='1.gif' width='300' height='131' border='0' alt='Salut!'></a><IMG SRC='2.gif' width='443' height='131'></td></tr></table>");

ヘッダーなど多くのページで使い回す箇所を、ひとつのファイルから呼び出して使うJavaScriptです。ここではheader.jsを呼び出すように設定しています。
あとから変更したくなったとき、header.jsを書き直すだけで、すべてのページが書き変わります。

demo.htmlにて、
<Script Language="JavaScript" src="header.js"></Script>
で、header.jsを呼び出すように設定しています。

header.jsは、
document.write("ここに呼び出すソースを記述");
という構成になっています。

注意
１：
document.write("");の中では「"」を使ってはいけません。なのでheader.jsでは「'」を使っています。ですが普通のページ同様、別になくても構いません。

２：
ディレクトリが違う場所から呼び出した場合、画像やリンクがうまく繋がらなくなることがあります。そのときは絶対パスで指定してください。
例）
<IMG SRC='1.gif'>
↓
<IMG SRC='/1.gif'>
逆に絶対パスで指定したときは、ローカル環境ではうまく繋がらなくなります。