<BODY>のアトリビュートを変更する

背景画像を例に説明します

一般には　：　body.style.アトリビュート=値
ここでは　：　body.style.background=画像ファイル名(URL)

下の画像をクリックすると、ページ全体の背景が変わります

<HTML>
<HEAD>
<TITLE>背景画像の変更</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE background="../back.jpg">
<center>
<TABLE border="1">
<TBODY>
<TR><TD>
<IMG src="b1.gif" onclick='body.style.background="url(b1.gif)"' width="200" height="60" border="0">
</TD></TR>
<TR><TD>
<IMG src="b2.gif" onclick='body.style.background="url(b2.gif)"' width="200" height="60" border="0">
</TD></TR>
<TR><TD>
<IMG src="b3.gif" onclick='body.style.background="url(b3.gif)"' width="200" height="60" border="0"><
</TD></TR>
<TR><TD>
<IMG src="b4.gif" onclick='body.style.background="url(b4.gif)"' width="200" height="60" border="0">
</TD></TR>
</TBODY>
</TABLE>
</center>
</BODY>
</htm>

下の画像をクリックすると、ページ全体の背景が変わります

<HTML>
<HEAD>
<TITLE>背景画像の変更</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE background="../back.jpg">
<center>
<TABLE border="1">
<TBODY>
<TR>
<TD><IMG src="b1.gif" onclick='body.style.background="url(b1.gif)"' width="200" height="60" border="0"></TD>
<TD><IMG src="black.jpg" onclick='body.style.background="none" ; body.style.backgroundColor="000000"' width="200" height="60" border="0"></TD>
</TR>
<TR>
<TD><IMG src="b2.gif" onclick='body.style.background="url(b2.gif)"' width="200" height="60" border="0"></TD>
<TD><IMG src="red.jpg" onclick='body.style.background="none" ; body.style.backgroundColor="ff0000"' width="200" height="60" border="0"></TD>
</TR>
<TR>
<TD><IMG src="b3.gif" onclick='body.style.background="url(b3.gif)"' width="200" height="60" border="0"></TD>
<TD><IMG src="blue.jpg" onclick='body.style.background="none" ; body.style.backgroundColor="0000ff"' width="200" height="60" border="0"></TD>
</TR>
<TR>
<TD><IMG src="b4.gif" onclick='body.style.background="url(b4.gif)"' width="200" height="60" border="0"></TD>
<TD><IMG src="yellow.jpg" onclick='body.style.background="none" ; body.style.backgroundColor="ffff00"' width="200" height="60" border="0"></TD>
</TR>
</TBODY>
</TABLE>
</center>
</BODY>
</htm>