Javascript之Firefox与IE

IE其实相对来讲并不是规范的遵循者,错怪firefox了。

1firefox不支持iframe.document, 而IE支持,所以对firefox使用contentDocument

        //firefox and IE is different
        var ddoc = menuIFrame.contentDocument||menuIFrame.document;

2 firefox不支持使用document.parent, 而IE可以。在firefox中直接使用parent.document

                   //document.parent.document shall not work in firefox!
                    parent.document.all.item("main").src = _this.items[this._index].url;

3 firefox不支持 document.all, 而IE支持, firefox 使用: d.getElementsByTagName("*")

4 光标下划线,如果超链接在firefox中默认有下划线,在windows中没有。

   统一使用: TEXT-DECORATION: none;

5 firefox光标显示小手, 需要使用cursor:pointer, 而IE则是cursor:hand或者sursor:pointer都可以。

  方案: style="cursor:pointer"

6 ul,li中css不起作用。主要用作tab页设计的那个,问题是css层级,标识符继承无效。 如:.a.b.c, 如果在b和c中有其他的id,则无效。 直接.c可以

7 css "margin:0 auto", div在IE下不对中, 解决方案,把如下放到页面头部。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

8 关于event, firefox不支持window.event, 用如下办法解决兼容问题; firefox不支持srcElement, IE不支持target

    document.all(trname).style.display = displayTag;
    eve=arguments.callee.caller.arguments[0] || window.event;
    var srcele = eve.srcElement?eve.srcElement:eve.target;

9关于style.display属性。

  style.display="block"中Firefox不好使, 如果同时兼容IE和Firefox, 则需要:

  style.display=""

  style.display="table-row" <- 注意只是针对table

10 form在IE中的留白

    style="margin:0; padding:0;" 加入这个会将留白去掉,与firefox保持一致。

11 input file onpropertychange is not supported by firefox

    if(navigator.userAgent.indexOf("MSIE")>0){
        document.getElementById('docID_1').attachEvent("onpropertychange",GetData);
    }else {
        document.getElementById('docID_1').addEventListener("input",GetData,false);
    }  

猜你喜欢

转载自www.cnblogs.com/bjfarmer/p/12179573.html