记一次开发中一个奇特的错误

2010-11-05 04:58

记一次开发中一个奇特的错误

by 依依老猫

at 2010-11-04 20:58:00

original http://www.cnblogs.com/lynnlin/archive/2010/11/04/1869391.html

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

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

代码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/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
<!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的解析实在令人费解。

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

作者: 依依老猫 发表于 2010-11-04 20:58 原文链接

评论: 0 查看评论 发表评论


最新新闻:
· 工信部对腾讯和360纠纷事件介入调查(2010-11-04 20:53)
· 亚洲最受尊敬的企业:苹果(2010-11-04 20:52)
· “3Q大战”致飞信下载搜索量上涨600%(2010-11-04 20:48)
· Google CEO认为中国对互联网控制最终会失败(2010-11-04 20:48)
· 微软免费杀毒软件MSE 2010 RC 更令我们期待(2010-11-04 20:40)

编辑推荐:腾讯称:将在装有360软件的电脑上停止运行QQ(持续更新)

网站导航:博客园首页  我的园子  新闻  闪存  小组  博问  知识库