解决Firefox下不支持outerHTML问题代码分享

  发布时间:2014-06-04 09:16:41   作者:佚名   我要评论
随着科技的日新月异,各种浏览器层出不穷,最近的项目要求对同时支持IE和FireFox等各种浏览器,为此深受其苦,尤其是对于我这个习惯了使用诸如:"event.srcElement"、"outerHTML"、"parentElement"的人来说。许多在IE中使用起来得心应手的对象和方法,在W3C标准面

代码很简单,如下:


复制代码
代码如下:

var pro = window.HTMLElement.prototype;
pro.__defineGetter__("outerHTML", function(){
var str = "<" + this.tagName;
var a = this.attributes;
for(var i = 0, len = a.length; i < len; i++){
if(a[i].specified){
str += " " + a[i].name + '="' + a[i].value + '"';
}
}
if(!this.canHaveChildren){
return str + " />";
}
return str + ">" + this.innerHTML + "</" + this.tagName + ">";
});
pro.__defineSetter__("outerHTML", function(s){
var r = this.ownerDocument.createRange();
r.setStartBefore(this);
var df = r.createContextualFragment(s);
this.parentNode.replaceChild(df, this);
return s;
});
pro.__defineGetter__("canHaveChildren", function(){
return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());
});

相关文章

  • HTML5中Checkbox标签详解

    本文详细介绍了Checkbox的基础属性、样式自定义及其应用场景,Checkbox通过<input>元素实现,样式自定义可以通过隐藏原始Checkbox、使用伪元素、JavaScript来实现,Chec
    2024-10-16
  • HTML5表单的自动验证、取消验证、自定义错误信息的操作

    本文介绍了HTML5中表单的自动验证、取消验证、自定义错误信息等功能,通过required、pattern、min、max和step属性,可以实现对表单输入的自动检查,novalidate和formnovalida
    2024-09-23
  • HTML5中使用Noto Sans CJK字体的详细步骤

    在HTML5项目中使用NotoSansCJK字体能提升用户体验,本文介绍了通过GoogleFonts在线加载和本地托管两种方法,在线加载无需下载,通过GoogleFonts链接快速引入,适合离线使用或
    2024-09-23
  • Html5播放hls格式的视频示例代码

    HLS是一种基于HTTP协议的流媒体传输协议,它的出现使得视频的传输更加稳定和可靠,本文给大家介绍Html5如何播放hls格式的视频,感兴趣的朋友一起看看吧
    2024-08-19
  • HTML5使用<blockquote>标签实现段落缩进效果

    使用<blockquote>标签可以实现页面文字的段落缩进,这一标签也是每使用一次,段落就缩进一次,并且可以嵌套使用,以达到不同的缩进效果,本文通过实例代码介绍HTML5使
    2024-07-08
  • window.open()各参数示例详解

    这篇文章主要介绍了window.open()各参数示例详解,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友跟随小编一起看看吧
    2024-06-19
  • HTML5 Canvas 实现在线签字功能(示例代码)

    在现代互联网应用中,有时我们需要让用户在网页上进行签字操作,比如确认文件、填写电子表格或者签署合同,利用 HTML5 的 canvas 画布,我们可以轻松地实现这一功能,为用
    2024-06-19
  • uniapp在h5页面实现扫码功能(html5-qrcode)

    这篇文章主要介绍了uniapp在h5页面实现扫码功能(html5-qrcode),本文结合实例代码给大家介绍的非常详细,需要的朋友可以参考下
    2024-06-11
  • HTML5中的A 标签详解

    a 元素可通过其href属性创建指向其他网页、文件、同一页面内的位置或其他URL的超链接,这篇文章主要介绍了HTML5中的A 标签,需要的朋友可以参考下
    2024-05-28
  • HTML5中的Button 标签示例详解

    button 用于显示一个可点击的按钮,可用在表单或文档的其它地方,button元素是内联双标签,不同浏览器下button样式不同,可以通过CSS修改,这篇文章主要介绍了HTML5 中的Bu
    2024-05-28

最新评论