被 FF and IE 的 image onload onerror 折腾的一天

本来是一个简单的img οnlοad=javascript:this.src='' οnerrοr= 的过程，

 

但是遇到几个问题：

1、FF的onerror怎么也触发不了，后来查看源码发现，src=""为空时，FF不认为image载入失败，郁闷。

 

 

2、onload死活就是调用不到,既然onload 不是标准，那我就用onerror好了，但是问题又出来了

 

3、onerror后再onerror怎么办:

     再次οnerrοr=function{XXXXXX}。

 

4、最初想法是[οnerrοr="this.src='../../common/skins/default/images/mid_pic_01.jpg'" ]，但是其中指定的路径是不存在的，于是一旦img标签的src属性指定的路径不存在时，onerror会被不停调用，形成了无限递归。IE就会报Stack overflow at line: 0：堆溢出的异常。

 

另附FF IE innerHTML outerHTML 兼容代码

 

///

//               主要实现ff和ie的一些属性、方法的兼容

///

 

 

if(window.HTMLElement) {

//兼容 ff  ie  的outerHTML 代码 开始

    HTMLElement.prototype.__defineSetter__("outerHTML",function(sHTML){

        var r=this.ownerDocument.createRange();

        r.setStartBefore(this);

        var df=r.createContextualFragment(sHTML);

        this.parentNode.replaceChild(df,this);

        return sHTML;

        });

 

    HTMLElement.prototype.__defineGetter__("outerHTML",function(){

    var attr;

        var attrs=this.attributes;

        var str="<"+this.tagName.toLowerCase();

        for(var i=0;i<attrs.length;i++){

            attr=attrs[i];

            if(attr.specified)

                str+=" "+attr.name+'="'+attr.value+'"';

            }

        if(!this.canHaveChildren)

            return str+">";

        return str+">"+this.innerHTML+"</"+this.tagName.toLowerCase()+">";

        });

 

HTMLElement.prototype.__defineGetter__("canHaveChildren",function(){

   switch(this.tagName.toLowerCase()){

            case "area":

            case "base":

         case "basefont":

            case "col":

            case "frame":

            case "hr":

            case "img":

            case "br":

            case "input":

            case "isindex":

            case "link":

            case "meta":

            case "param":

            return false;

        }

        return true;

 

     });

 

//兼容 ff  ie  的outerHTML 代码 结束

 

//兼容 ff  ie  的click 代码 开始

HTMLElement.prototype.click = function()

{

    var evt = this.ownerDocument.createEvent('MouseEvents');

    evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);

    this.dispatchEvent(evt);

}

//兼容 ff  ie  的click 代码 结束

 

/**兼容ie的innerText start added by huwei*/

HTMLElement.prototype.__defineGetter__("innerText", 

        function(){ 

            return this.textContent.replace(/(^/s*)|(/s*$)/g, "");

        } 

); 

 

HTMLElement.prototype.__defineSetter__("innerText", 

function(sText){ 

            this.textContent=sText; 

        } 

); 

/**兼容ie的innerText end*/

 

 

/**兼容ie的event等 

调用方式：var event = getEvent();

Start added by huwei*/

function  getEvent(){   

    if(document.all) return  window.event;   

 

    func = getEvent.caller;   

    while(func!=null){   

        var  arg0=func.arguments[0];   

 

        if(arg0 instanceof Event) {   

            return  arg0;   

        }   

       func=func.caller;   

    }   

    return   null;   

}

 

/**兼容ie的event等 end*/

 

 

}