IE6 IE7 IE8的CSS JS兼容

2014/5/20 11:13:00css

Internet Explorer 6中查看使用 Microsoft JScript 的网页,可能会遇到web浏览器速度较慢的性能问题。原因是如果js脚本同时创建大量变量,jscript引擎执行垃圾收集算法时会监视脚本中变量分配的 数量、脚本中使用的文字值的数量和脚本中分配的字符串值的总大小,如果超过这些值的阈值,就会发生垃圾收集,垃圾收集进程会中断正在运行的脚本。因此,这 些运行中的脚本将被挂起,直至垃圾收集完成为止。

IE6 . IE7 . IE8 在 CSS 和 JS 方面的区别 :

  1. IE8中的css中关于width或是height中如果使用像素形式作为参数时,参数必须是带“px”的,而且此参数必须是大于0的,而在IE6和IE7中是支持不带“px”参数的,而且参数是可以为一个负数。
  2. 如:style=height:180px\\0;只有IE8能识别,style=height:180px\\9,IE都能识别。
  3. IE8中的css中border-style:outset;是没有效果的。
  4. IE8中的无序列表之间的距离要比IE6和IE7大的多。
  5. IE6能识别*,但不能识别!important,IE7能识别*也能识别!important。
  6. IE6支持下划线,IE7不支持下划线。
  7. 在IE8中,一个Iframe中取event.x的值不是Iframe中的相对x坐标,而是最外层的window的x坐标,但是event.y 却是取的是 Iframe中的相对y坐标。而在IE6和IE7中,event.x和event.y却得的都是所在Iframe中的相对坐标,可以用 event.clinetX代替。
  8. 在ie6中,使用window.status =" 欢迎光临我的博客!!!",就能在状态栏显示这么一行字,但在IE7中,IE7的安全性设置中,默认是不允许脚本更新状态栏的.
  9. IE8会把对 IE6,7,8 用 css 进行测试:
IE6 IE7 IE8 备注
p{_color:red} × × IE6专用
*html p{color:#red;} × × IE6专用
p{+color:red} × IE6,7 专用
p{*color:red} × IE6,7 专用
*html p{color:red;} × IE6,7 专用
p{*+color: red} × × IE7 专用
body> p{ color: red } × 屏蔽 IE6
/*\\*//*/p{+color:red}/**/ × × IE8 专用
p{/*/*/color;/**/} × 屏蔽 IE8
p{color:red} 都能用
html>/**/body .head{color:#red;} × × IE8 专用

对于IE8对js新增的功能:

  1. IE8开始支持一些新的W3C规格,其中多了querySelector和querySelectorAll两个函数
  2. IE8引入XDomainRequest跨站数据获取功能。 这是一个非常有趣的进行跨站数据获取的功能,不过它与Firefox 3中的跨站 XMLHttpRequest的工作原理不太一样。它的跨域并不是无限制的。需要服务端返回http header中带有XDomainRequestAllowed=1才可以跨域,否则是不成功的。XMLRequest 不能跨站一直都是多子域服务器的硬伤。使得很多情况不得不考虑最原始的动态script和JSON的方式。不过IE8团队有意解决跨站访问数据的问题,这 是IE8的一个进步。另外,IE8下的XMLHttpRequest增加了一个很重要的属性 timeout和ontimeout方法,它在对程序进行优化时极其重要。
  3. getElementById可以通过id来返回对象。getAttribute("checked") 现在返回“checked”而不是true。动态创建(或修改)的单选按钮现在可以被选择了。

支持更多对HTML5的功能:

  1. window.location.hash。这个功能已经被多数浏览器支持的非常好。在IE8标准模式中将window.location.hash中的 更改作为导航,并保存先前文档的URL,可以像在Ajax应用中模仿“后退”按钮效果。IE8中对它进行了改良,可以广播这个hashchanged时 间。
  2. DOM存储。通过这个功能,数据可以持续保存在本地,它将取代原始的cookie存DOM存储。
  3. postMessage。IE8现在支持跨文件消息通讯(Cross-Document Messaging-XDM)!通过onmessage事件和postMessage方法,两个来自不同域的网页可以进行通讯。目前IE8、Opera 9、Firefox 3和WebKit nightlies版均支持这个功能,也就是说,该功能几乎已被所有最新浏览器支持。
  4. Offline Events。在IE 8中拥有一些离线事件来检测网络的中断,通过它我们可以编写精彩的离线Ajax应用。目前来看支持这一功能的浏览器包括Firefox3和IE8。
    用firefox或者chrome一登陆最小系统就报480分钟超时错误

IE6 Bugs

  1. 不支持用样式设置 <abbr> 元素
  2. 不支持以连字符和下划线开头的 class 和 ID 名
  3. <select> 元素总是出现在堆叠最上面,而无视 z-index 值
  4. 如果锚点的伪类没有使用正确的顺序 ( :link , :visited , :hover ) ,:hover 伪类将无效
  5. 一个属性的 !important 声明会被同一规则中同一属性的没有使用 !important 的第二个声明覆盖。
  6. height 表现类似于 min-height , width 表现类似于 min-width ,左右 margin 双倍
  7. 圆点边框 (dotted) 看起来像虚线边框 (dashed)
  8. text-decoration 的 line-through 值在文字上看起来比别的浏览器要高一些
  9. 有序列表如果有一个固定结构 (haslayout 为 true ,不能设置 li 的高度 / 宽度 /zoom 等激活 haslayout 的值 ) ,序号就不会增加,而是保持为 1
  10. 列表元素不支持 list-style-type 的所有可用的值
  11. 如果列表条目浮动,指定的 list-style-image 将不会显示
  12. 不完全支持 @font-face
  13. 某些选择器会错误的匹配注释和文档声明
  14. 如果一个 ID 选择器结合一个类选择器不匹配,同样的 ID 选择器结合不同的类选择器也将被当作不匹配。

IE7 bugs

  1. 有序列表如果有一个固定结构 (haslayout 为 true ,不能设置 li 的高度 / 宽度 /zoom 等激活 haslayout 的值 ) ,序号就不会增加,而是保持为 1
  2. 列表元素不支持 list-style-type 的所有可用的值
  3. 如果列表条目浮动,指定的 list-style-image 将不会显示
  4. 不完全支持 @font-face
  5. 某些选择器会错误的匹配注释和文档声明

本文由我的原始笔记迁移而来:原始链接

https://www.cnblogs.com/jsoncode/p/3738470.html