教えてください。ページ全体の背景色を変更するのは、 ↓でできたのですが、ページ内の一部のテーブルのみの背景色を変更したい場合はどうように変更すればいいのでしょうか？教えてください！

あたしなら・・・・・・位で済ませちゃうけど、コレじゃダメかな？

クリックでテーブル内の背景色だけを変更したいです。

解決済

質問者：chiiii
質問日時：2006/04/03 14:24
回答数：3件

教えてください。

ページ全体の背景色を変更するのは、
↓でできたのですが、

<form>
<input type="button" value="White" onClick="document.bgColor='white'">
<input type="button" value="Gray" onClick="document.main='gray'">
<input type="button" value="Blue" onClick="document.bgColor='blue'">
</form>

ページ内の一部のテーブルのみの背景色を
変更したい場合はどうように変更すればいいのでしょうか？

教えてください！

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： yambejp
回答日時：2006/04/03 20:05

特定の設定を使いまわすなら、cssでclassを

いじる方法もあります。

<style type="text/css">
.white{
background-Color:white;
color:black;
}
.gray{
background-Color:gray;
color:yellow;
}
.blue{
background-Color:blue;
color:red;
}
</style>
<body>
<form>
全体：
<input type="button" value="White" onClick="document.body.className='white'">
<input type="button" value="Gray" onClick="document.body.className='gray'">
<input type="button" value="Blue" onClick="document.body.className='blue'"><br>
テーブル1:
<input type="button" value="White" onClick="document.getElementById('t1').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t1').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t1').className='blue'"><br>
テーブル2:
<input type="button" value="White" onClick="document.getElementById('t2').className='white'">
<input type="button" value="Gray" onClick="document.getElementById('t2').className='gray'">
<input type="button" value="Blue" onClick="document.getElementById('t2').className='blue'"><br>
</form>

<table width=100% id="t1">
<tr><td>test</td></tr>
</table>
<table width=100% id="t2">
<tr><td>test</td></tr>
</table>
</body>

- 0
- 件

通報する

この回答へのお礼

ありがとうございます！
バッチリできましたー！！！

通報する

お礼日時：2006/04/03 21:26

No.2

回答者： noname#22259
回答日時：2006/04/03 15:52

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html lang=ja><head>
<script type="text/javascript">
function chClr(id,clr){
clr=clr.toLowerCase();
if(document.getElementById) document.getElementById(id).style.backgroundColor=clr;
else if(document.all) document.all[id].style.backgroundColor=clr;
else if(document.layers) document.layers[id].style.backgroundColor=clr;
else return false;
}
</script>
</head>
<body>
<table border=1><td id="aTd">AAAAAAA</td></table>
<p>
<input type="button" value="Yellow" onclick="chClr('aTd',this.value)">
</p>
</body>
</html>

;-)

- 0
- 件

通報する

この回答へのお礼

こちらの方法でもチャレンジしてみたところ、
できました！
色々な方法があるんですね。

ありがとうございました！

通報する

お礼日時：2006/04/03 21:27

No.1

回答者： NTJ
回答日時：2006/04/03 14:42

あたしなら・・・

<TABLE id=aTable>
・・・
</TABLE>

<INPUT type="button" onclick="document.getElementById('aTable').style.backgroundColor=this.value;" value="white">

位で済ませちゃうけど、コレじゃダメかな？