firefox|js| Solution | Show |tbody
Today to help others write a Web page, found: When using JavaScript dynamically set Tr.style.display = "Block" To display a row, using IE browsing is no problem, but the use of Firefox browsing when the row was moved to the back of the other line, is very surprised. Look at the following example:
<script type= "Text/javascript" >
function Body_load ()
{
var obj = document.getElementById ("TR1");
Obj.style.display = "block";
}
</script>
<body >
<table>
<tbody id= "TR1" style= "Display:none" >
<tr>
<td> First line </td>
</tr>
</tbody>
<tbody id= "TR2" >
<tr>
<td> Second Line </td>
</tr>
</tbody>
<tbody id= "TR3" >
<tr>
<td> Third line </td>
</tr>
</tbody>
</table>
</body>
When it is displayed in Firefox, the "First row" is displayed on the last line.
So after processing the lines that need to be displayed, write another function, first record the rows that need to be displayed, and then set the style.display of all rows to none, and then display the rows that need to be displayed in turn. In this way, IE and Firefox display the same results.
Later, I still think this method is very stupid, and painstaking research, found that as long as the second line and all three lines plus style= "Display:block", the display is normal. See the following code:
<script type= "Text/javascript" >
function Body_load ()
{
var obj = document.getElementById ("TR1");
Obj.style.display = "block";
}
</script>
<body >
<table>
<tbody id= "TR1" style= "Display:none" >
<tr>
<td> First line </td>
</tr>
</tbody>
<tbody id= "TR2" style= "Display:block" >
<tr>
<td> Second Line </td>
</tr>
</tbody>
<tbody id= "TR3" style= "Display:block" >
<tr>
<td> Third line </td>
</tr>
</tbody>
</table>
</body>
This shows that firefox on whether to set style= "Display:block" is differentiated, and IE made the appropriate compatible treatment.
The conclusion and lesson is: try to use standard practices and do not expect browsers to be compatible. ie use more often will forget this point.
Note: If you do not use tbody, you do not have this problem. However, tbody can play a role in grouping rows, which is useful when you want to show or hide multiple rows at once.