本文探讨了HTML文件中JavaScript代码在不同浏览器（如Firefox和Safari）中的兼容性问题，特别是关于display属性在不同浏览器中的表现差异，并提供了解决方案。
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中正常，但是在FireFox和Safari中就会出错。
问题：
在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="";
扫一扫
877
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
