Javascriptでの開閉リストの質問

質問

Javascriptで、開閉式のリストで、親テーブルをクリックすると子テーブルが現れ、親テーブルの背景が変わる仕組を作りました。再度、親テーブルをクリックすると背景が戻り、子テーブルが隠れる仕組みです。IEでは動作するのですが、他のブラウザだと背景が元のまま変わらずに子テーブルだけ
現れて、とても困っています。

下がサンプルなのですが、親のテーブルの背景がクリックされると同時に変わる仕組みなのですが、IEだけは変わるのですが、他のブラウザで変わってくれません。（涙）何か改善しなくてはいけない場所があれば教えていただきたく、何卒よろしくお願い申し上げます。

<SCRIPT LANGUAGE="JavaScript">
function openFolder(childObj, parentObj){
var child="";
var parent="";

if(ie || ns6 || opera){
child=ns6 ? document.getElementById(childObj).style : document.all(childObj).style;
parent=ns6 ? document.getElementById(parentObj) : document.all(parentObj);
if (child.display=="none"){
child.display="block";
parent.background="images/show.jpg";
}else{
child.display="none";
parent.background="images/hide.jpg";
}
}
}
</SCRIPT>

（↓親側）
<table id="close_0" onclick="openFolder('open_0', 'close_0')" class="parent" style=padding-left:5px; width="100" height= "32" border="0" cellspacing="0" cellpadding="0" background="images/hide.jpg"> <tr>
<td>test</td>
</tr>
</table>
（↓子側）
<table width="100" border="0" cellspacing="0" cellpadding="0" id="open_0" class="child" style="display:none;">
<tr>
<td>test2</td>
</tr>
</table>

回答No.1

yambejp · ベストアンサー

きょうびdocument.allに対応させる必要を感じませんが・・・
背景もスタイルシートにしてしまえば解りやすいかも

<script>
function openFolder(childObj, parentObj){
var child= document.getElementById(childObj).style;
var parent= document.getElementById(parentObj).style;
if (child.display=="none"){
child.display="block";
parent.background="url(2.jpg)";
}else{
child.display="none";
parent.background="url(1.jpg)";
}
}
</script>

（↓親側）
<table id="close_0" onclick="openFolder('open_0', 'close_0')" class="parent" style="padding-left:5px;width:100px;height:32px;border:0px solid;padding:0px;background:url(1.jpg);"> <tr>
<td>test</td>
</tr>
</table>
（↓子側）
<table width="100" border="0" cellspacing="0" cellpadding="0" id="open_0" class="child" style="display:none;">
<tr>
<td>test2</td>
</tr>
</table>

お礼

アドバイス、ありがとうございます。うまくいきました。