display顯示與隱藏時，原先的樣式會被改變，導致不正常顯示事先定義好的樣式。

1、當表格為多列的情況下，屬性為"display:block"行的內容寬度僅與第一列寬度相同，也就是說無論你使colspan的屬性值為多少，剩餘列的空間都不進行解析。
2、同一行反覆的在"display:none;"與"display:block;"兩個狀態間切換時，表格的底部會持續的產生多餘的空白空間以至於造成頁面佈局的扭曲。

//jsp頁面程式碼

<s:iterator value="dtoInteRuleList" status="num">

<tr bgcolor="#F4F4F4" align="center" height="25"
onmouseout="this.style.backgroundColor='#F4F4F4'"
onmouseover="this.style.backgroundColor='#ddeeff'" style="display:none">
<td><input type="checkbox" name="attachmentList"
value="${id}_rule" />
</td>
<td>${num.index + 1}</td>
<td>${policyName}</td>
<td>1</td>

</tr>

</s:iterator>

//js程式碼

//多選框選擇事件
function checkBox(obj){


//alert(obj.value);
 var attchmentName = document.getElementsByName("attachmentList");
 
 for(var i = 0;i<attchmentName.length;i++){
//alert(attchmentName[i].value);
 if(attchmentName[i].value==obj.value){
if(attchmentName[i].checked){
 
attchmentName[i].checked=false;
attchmentName[i].parentNode.parentNode.style.display = "none";
}else{
attchmentName[i].checked=true;
attchmentName[i].parentNode.parentNode.style.display = "";

                                                //attchmentName[i].parentNode.parentNode.style.display = "block";
} 
 


 }


}
}

當使用這個程式碼/attchmentName[i].parentNode.parentNode.style.display = "block";時，tr裡面的樣式都沒了，顯示不正常。但是換成這個attchmentName[i].parentNode.parentNode.style.display = "";時，樣式沒有改變。

網上查詢，有人建議：樣式放置在class裡。