Firefox火狐的一个奇特的错误

最近写一个关于用JavaScript做图片自动切换问题发现一个非常奇特的问题，除了空格和换行外完全相同的代码，在Firefox下却有截然不同的运行结果，今天记录以提供他人留意及自我备查。

废话不多说，先上代码给大家看看

代码1

<!-- {cps..0}--><! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
< title > 依依园地 </ title >
</ head >
< body >
     < div  id ="win" >
         < ul  id ="picChange" >
             < li >
                 < img   src ="images/01.jpg"  title ="图片1" ></ li >
             < li >
                 < img   src ="images/02.jpg"  title ="图片2" ></ li >
             < li >
                 < img   src ="images/03.jpg"  title ="图片3" ></ li >
         </ ul >
     </ div >
< script  type ="text/javascript" >
var  pic  =  document.getElementById( ' picChange ' );
var  picList  =  pic.getElementsByTagName( " li " );
alert(picList[ 0 ].firstChild);
</ script >
</ body >
</ html >

 

 以上代码1请分别在Firefox和IE中运行，Firefox出现的是 [object Text] ，而IE中出现的是[object]，这里IE和Firefox都把picList[ 0 ].firstChild 这个对象当作object对象，Firefox提示是Text类型对象，IE没有提示更细了。

我们再运行下面这部分的代码看看，看清楚了，代码本身相同，但是li下面没做换行缩进。

代码2

<!-- {cps..1}--><! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
< title > 依依园地 </ title >
</ head >
< body >
     < div  id ="win" >
         < ul  id ="picChange" >
             < li >< img   src ="images/bigpic/01.jpg"  title ="护腰/HY005" ></ li >
             < li >< img   src ="images/bigpic/02.jpg"  title ="枕头吊臂/DB-004" ></ li >
             < li >< img   src ="images/bigpic/03.jpg"  title ="大护脚/HY-001" ></ li >
         </ ul >
     </ div >
< script  type ="text/javascript" >
var  pic  =  document.getElementById( ' picChange ' );
var  picList  =  pic.getElementsByTagName( " li " );
alert(picList[ 0 ].firstChild);
</ script >
</ body >
</ html >

以上代码2请分别在Firefox和IE中运行，Firefox出现的是 [object HTMLImageElement] ，而IE中出现的是[object]，这里IE和Firefox都把picList[ 0 ].firstChild 这个对象当作object对象，Firefox提示是HTMLImageElement类型对象，IE没有提示更细了。

上下两种写法只是缩进和换行的差别，在IE中被认做相同的object对象，可是不同的缩进在Firefox中却代表了不同的对象，Firefox对HTML的解析实在令人费解。

再此做记录，希望各位朋友看了有用，别因为跟我一样的问题半天没找到解决问题的方法。

评论

1 楼 waiting 2010-11-07  

你试试看在代码2中 img前面加个空格。