都是 <!DOCTYPE html> 标签 惹的祸

前几天闲着无聊,用jQuery写了一个很炫的动画效果,昨天拿给朋友看,小小炫耀了一番。
可是没想到就是这番小炫耀,造成了我今天小小的杯具…
当时朋友看了效果觉得还不错,让我帮忙加到她的博客上。
我把代码原封不动的copy上去之后却发现不能正常显示效果,
总是莫名其妙的出现了一些随机bug,每次的效果竟然都不同。
一开始以为是某个js冲突或者css样式冲突,当我把博客上所有js和css都删掉之后,还是不能正常显示…
我个亲娘四舅奶奶的郁闷啊,被逼无奈,用上了排除法。
先从代码相近的html元素开始,一点点删除,一点点排除,直到最后让我扒的网页只剩一个裸体特效了,竟然还是不能正常显示…
邪门了,我擦擦眼睛,仔细看了看我的demo代码和被扒的博客页面代码,发现唯一的区别就是 <!DOCTYPE> 标签了。
终于找到了问题所在,整个过程持续了2个小时。
原来朋友的博客是几年前做的,是HTML4的声明:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
我的demo效果是用EditPlus创建的,是XHTML声明:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
其实早在04年就读过阿捷关于DOCTYPE的文章,
不同的标签会让浏览器按照不同的html规范解释代码。
只是没想到<!DOCTYPE html>标签也会影响javascript的解释效果,这下吃了小亏,浪费了2个小时的宝贵时光。
记录下来,以免再犯。  😥
TrackBack: http://mimiz.cn/index.php/web/doctype-html-tag/trackback/
7 Responses to “都是 <!DOCTYPE html> 标签 惹的祸”
  1. 美瘦榜 Says:

    😯 有点复杂!

  2. 防锈油 Says:

    :roll: :roll: :roll: 就的可以!!!

  3. 闪图 Says:

    看看了啊 :roll:

  4. 纤瘦 Says:

    😀 好久没更新新文章了啊~

  5. 星星之火 Says:

    汗,以前以为那个声明没什么用,只是一个规范呢。。

  6. 北京装修 Says:

    哈哈,文章不错,有点意思,收藏了

  7. 今日黄金价格每克 Says:

    吃一堑长一智,谢谢分享。

Leave a Reply !

^_^您敢留下回复吗?