|
 |
栏目导栏 |
|
| |
|
|
|
|
|
资料搜索 |
|
| |
|
|
|
|
|
热门文章 |
|
| |
|
|
|
|
|
最新文章 |
|
| |
|
|
|
| |
| |
|
|
|
|
我不想挑起IE与Firefox之间的争论，我只想说说Firefox浏览器有而IE里没有的一个功能，对DOM里的对象原型的扩展。 PLjLinux联盟
PLjLinux联盟
在DOM里的window、document、element、event等这些对象在Firefox（或者说Mozilla核心的浏览器）里都有与之对应的原型：Window、HTMLDocument、HTMLElement、Event等，对于这些原型扩展之后，那些window、document等对象就“自动”拥有某些成员属性或者成员方法了。举个简单的例子，比如在IE里都有一个 outerHTML 属性，可以取得这些元素所有的细节信息，但是这个属性不是W3C标准属性，所以那些非IE的浏览器就不会拥有这种属性了。不过因为这个属性使用起来非常方便，我想在Firefox之类的浏览器里也使用这个属性那该怎么办呢？这里就要用到原型扩展了： PLjLinux联盟
PLjLinux联盟
<script type="text/javascript">/*<![CDATA[*/ PLjLinux联盟
if(typeof(HTMLElement)!="undefined" && !window.opera) PLjLinux联盟
{ PLjLinux联盟
HTMLElement.prototype.__defineGetter__("outerHTML",function() PLjLinux联盟
{ PLjLinux联盟
var a=this.attributes, str="<"+this.tagName, i=0;for(;i<a.length;i++) PLjLinux联盟
if(a[i].specified) str+=" "+a[i].name+'="'+a[i].value+'"'; PLjLinux联盟
if(!this.canHaveChildren) return str+" />"; PLjLinux联盟
return str+">"+this.innerHTML+"</"+this.tagName+">"; PLjLinux联盟
}); PLjLinux联盟
HTMLElement.prototype.__defineSetter__("outerHTML",function(s) PLjLinux联盟
{ PLjLinux联盟
var r = this.ownerDocument.createRange(); PLjLinux联盟
r.setStartBefore(this); PLjLinux联盟
var df = r.createContextualFragment(s); PLjLinux联盟
this.parentNode.replaceChild(df, this); PLjLinux联盟
return s; PLjLinux联盟
}); PLjLinux联盟
HTMLElement.prototype.__defineGetter__("canHaveChildren",function() PLjLinux联盟
{ PLjLinux联盟
return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase()); PLjLinux联盟
}); PLjLinux联盟
} PLjLinux联盟
/*]]>*/</script> PLjLinux联盟
PLjLinux联盟
加了这么一段代码之后，在Firefox浏览器里再调用 document.getElementById("divId").outerHTML，（读取/赋值）一切正常，这一点优势是IE系列浏览器所不具有的。这一点算是 Firefox 浏览器（Mozilla核心的浏览器）的一个亮点吧！ PLjLinux联盟
PLjLinux联盟
下面再写两个比较有用的扩展吧： PLjLinux联盟
<script type="text/javascript">/*<![CDATA[*/ PLjLinux联盟
if(!window.attachEvent && window.addEventListener) PLjLinux联盟
{ PLjLinux联盟
Window.prototype.attachEvent = HTMLDocument.prototype.attachEvent= PLjLinux联盟
HTMLElement.prototype.attachEvent=function(en, func, cancelBubble) PLjLinux联盟
{ PLjLinux联盟
var cb = cancelBubble ? true : false; PLjLinux联盟
this.addEventListener(en.toLowerCase().substr(2), func, cb); PLjLinux联盟
}; PLjLinux联盟
Window.prototype.detachEvent = HTMLDocument.prototype.detachEvent= PLjLinux联盟
HTMLElement.prototype.detachEvent=function(en, func, cancelBubble) PLjLinux联盟
{ PLjLinux联盟
var cb = cancelBubble ? true : false; PLjLinux联盟
this.removeEventListener(en.toLowerCase().substr(2), func, cb); PLjLinux联盟
}; PLjLinux联盟
} PLjLinux联盟
if(typeof Event!="undefined" && !window.opera) PLjLinux联盟
{ PLjLinux联盟
var t=Event.prototype; PLjLinux联盟
t.__defineSetter__("returnValue", function(b){if(!b)this.preventDefault(); return b;}); PLjLinux联盟
t.__defineSetter__("cancelBubble",function(b){if(b) this.stopPropagation(); return b;}); PLjLinux联盟
t.__defineGetter__("offsetX", function(){return this.layerX;}); PLjLinux联盟
t.__defineGetter__("offsetY", function(){return this.layerY;}); PLjLinux联盟
t.__defineGetter__("srcElement", function(){var n=this.target; while (n.nodeType!=1)n=n.parentNode;return n;}); PLjLinux联盟
} PLjLinux联盟
/*]]>*/</script> PLjLinux联盟
PLjLinux联盟
以上的代码都是截取于我写的 jsframewrok 框架。 PLjLinux联盟
Linux联盟收集整理 ,转贴请标明原始链接,如有任何疑问欢迎来本站Linux论坛讨论 |
|
|
|
|
|
