思路话语

。Arlen:思想有多远你就能走多远...

Firefox中设置tr的dispay为block会产生白块

HTML文件:

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

<HTML>

 <HEAD>

 <TITLE> New Document </TITLE>

   <SCRIPT LANGUAGE="JavaScript">

 <!--

 var i =1;

       function change()

       {

          

           var dd = 'tr'+i;

              document.all(dd).style.display="none";

          i ++;

       }

   var j =1 ;

       function changeadd()

       {

          

           var dd = 'tr'+ j ;

              document.all(dd).style.display="block";

           j ++;

       }

 //-->

 </SCRIPT>

 </HEAD>

 

 <BODY>

 <TABLE border="1">

 <TR id ="tr1">

       <TD>w</TD>

       <TD>w</TD>

       <TD>w</TD>

       <TD>w</TD>

       <TD>w</TD>

 </TR>

 <TR id ="tr2">

       <TD>s</TD>

       <TD>d</TD>

       <TD>d</TD>

       <TD>d</TD>

       <TD>d</TD>

 </TR>

 <TR id ="tr3">

       <TD>333</TD>

       <TD>33</TD>

       <TD>3</TD>

       <TD>3</TD>

       <TD>3</TD>

 </TR>

 <TR id ="tr4">

       <TD>55</TD>

       <TD>5</TD>

       <TD>5</TD>

       <TD>5</TD>

       <TD>555</TD>

 </TR>

 </TABLE>

<BUTTON onclick="change();"> 去除一行</BUTTON>

<BUTTON onclick="changeadd();"> 增加一行 </BUTTON>

 </BODY>

</HTML>

以上代码在ie中正常,但是在FireFoxSafari中就会出错。

问题:
Firefox中执行后"display:none;"没有回收"display:block;"开辟的页面空间,
下次再执行"display:block;"又会在页面上重新创建显示空间。
 原因:
The reason it "appears" to work with IE is probably because IE is
error-correcting the display property for you.As others have implied,
IE has no concept of the table-row value. In fact,Microsoft's documentation
(<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp>)
clearly states that all block-like elements (with a few exceptions) have
'block' as their display value, contrary to specification.
 
解决:
将代码
style.display="block";
修改为
style.display="";

posted on 2009-05-26 21:36  Arlen  阅读(252)  评论(0)    收藏  举报

导航