tableのtrの要素数を番号順に取得したい

解決済

質問者：singosingosingo
質問日時：2006/05/17 02:01
回答数：3件

現在、tableでのデザインを考えています。
やりたい事はテーブルにマウスカーソルを合わせた際にカーソルを合わせた行の色を変えるというものです。またjavascriptは外部ファイル化したいと考えていますが、javascriptの知識がなく困っておりまして
申し訳御座いませんが皆様どうぞよろしくお願い致します。
http://www.tagindex.com/kakolog/q2bbs/1/114.html
こちらのページの2005/07/27 16:50に投稿された方のソースを参考に
html内ではこのような感じで
<body onload="CellColorAlternate();">
テーブルでは
<table onmouseover="CellColorAll()" onmouseout="CellColorAlternate()">

外部ファイルでは
function CellColorAlternate(){
var cell = document.getElementsByTagName("tr");
for (i = 0; i < cell.length; i++) {
if(!(i%2)){
cell[i].style.backgroundColor = "#CCFFCC";
} else {
cell[i].style.backgroundColor = "#FFCCCC";
}
}
}
function CellColorAll(obj){
var cell = document.getElementsByTagName("tr");
for (i = 0; i < cell.length; i++) {
if(!(i%2)){
cell[i].style.backgroundColor = "#FFCCCC";
} else {
cell[i].style.backgroundColor = "#CCFFCC";
}
}
}
このようにするとカーソルを合わせた時にすべての行が入れ子にはなるのですが、上記の外部ファイルに付け加えるような形でこれをマウスを合わせた部分だけ変更するにはどのようにしたらよろしいのでしょうか？

通報する

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

質問の本文を隠す

回答 (3件)

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

No.3ベストアンサー

回答者： BLUEPIXY
回答日時：2006/05/17 15:26

//外部スクリプト

- 0
- 件

通報する

この回答へのお礼

BLUEPIXYさんもソースを教えていただきましてありがとうございます。参考にさせていただき勉強になりました。ありがとうございますｍ（＿＿）ｍ

通報する

お礼日時：2006/05/18 06:34

No.2

回答者： noname#22259
回答日時：2006/05/17 09:26

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

<html><head><title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" src="external.js">
</head>
<body>
<table width="200" border="1">
<tr id="tr1" onmouseover="bcolor(this.id);" onmouseout="bcolor(this.id);">
<td >少年易老</td><td >学難成</td></tr>
<tr id="tr2" onmouseover="bcolor(this.id);" onmouseout="bcolor(this.id);">
<td >一寸光陰</td><td >不可軽</td></tr>
</table>
</body>
</html>

----external.js----------------
function bcolor(d_name){
if (document.getElementById){
var tcell = document.getElementById(d_name).style;
if(tcell.backgroundColor=='yellow')tcell.backgroundColor='white';
else tcell.backgroundColor='yellow';
}
}
-------------------------------

- 0
- 件

通報する

この回答へのお礼

ソースを教えていただきましてありがとうございます。
とても参考になりましたｍ（＿＿）ｍ

通報する

お礼日時：2006/05/18 06:32

No.1

回答者： BLUEPIXY
回答日時：2006/05/17 02:59

互い違いに色を付けるのは止めるということですか？

この回答への補足

質問の仕方が変で申し訳ありませんでした。
質問内の入れ違いに色を変更する外部ファイル内の記述は削除し、やりたい事は
マウスカーソルをのせた「行」だけ色を変更したいということです。

またjavascript部分は外部ファイルで記述したいと考えています。

あとseoの事を考え、
<td>この部分</td>
テーブル内の「この部分」にあたる文字列は
外部ファイルの中に配列のようにはせずに
拡張子htmlのファイルの中に記述したいと
考えています。
どうぞよろしくお願い致します。

補足日時：2006/05/17 03:23

通報する