详解IE6/7浏览器兼容性问题及解决方案-优快云博客

本文链接：https://blog.youkuaiyun.com/zxycode007/article/details/7161686

1、IE6/7的setAttribute设置属性的BUG，  属性名和W3C标准不一样，常见的如下
 
左边为标准游览器的，右边是IE的。
varIEfix = { 
 
  acceptcharset:"acceptCharset", 
 
  accesskey:"accessKey", 
 
  allowtransparency:"allowTransparency", 
 
  bgcolor:"bgColor", 
 
  cellpadding:"cellPadding", 
 
  cellspacing:"cellSpacing", 
 
  "class": "className", 
 
  colspan: "colSpan", 
 
  checked:"defaultChecked", 
 
  selected:"defaultSelected", 
 
  "for": "htmlFor" ,  
 
  frameborder: "frameBorder", 
 
  hspace: "hSpace", 
 
  longdesc: "longDesc",  
 
  maxlength: "maxLength", 
 
  marginwidth: "marginWidth",  
 
  marginheight: "marginHeight", 
 
  noresize: "noResize", 
 
  noshade: "noShade", 
 
  readonly:"readOnly", 
 
  rowspan: "rowSpan", 
 
  tabindex: "tabIndex", 
 
  valign: "vAlign", 
 
  vspace: "vSpace" 
}
 2、IE6/7动态创建table不显示
 下面这种方式可以创建table，并附加到Dom树中，但是在IE中是不显示的：var table = document.createElement("TABLE");
var tr = document.createElement("TR"); 
var td = document.createElement("TD"); 
var text = document.createTextNode("text"); 
td.appendChild(text); 
tr.appendChild(td); 
table.appendChild(tr);
document.body.appendChild(table);
不报错，用Dom查看器也可以看到整个table被完整创建了，并附加到body里面，但就是不显示。这是因为在IE里不允许将tr直接附加到table里，而要先将tr附加到tbody中，然后再将tbody附加到table下。所以正确的应该是：
var table = document.createElement("TABLE");
var tbody = document.createElement("TBODY"); 
var tr = document.createElement("TR"); 
var td = document.createElement("TD"); 
var text = document.createTextNode("text"); 
td.appendChild(text); 
tr.appendChild(td); 
tbody.appendChild(tr) 
table.appendChild(tbody);
document.body.appendChild(table);
FireFox中不存在这个问题。需要注意的是显性的利用HTML构造table时，tbody元素不是必须的，可能IE在解析的时候会自动加入tbody吧，否则就解释不通了？

 
3、IE6、7不支持border:hidden属性
解决方法用none代替hidden；

 

 
4、IE6不支持PNG格式图片背景
解决方法：用无透明度的gif或jpeg代替（牺牲效果），使用IE滤镜加透明效果。

 
5、IE6默认不缓存背景图片导致闪烁，CSS里每次更改图片的位置时都会重新发起请求，用这个方法告诉IE6缓存背景图片
try {

document.execCommand('BackgroundImageCache', false, true);

} catch(e) {}
 6、IE/6/7/8 
  
 头部必须加入，否则会有灵异现象产生 
  
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  


 