FF的outerHTML

最新推荐文章于 2015-07-30 14:54:12 发布

iteye_19781

最新推荐文章于 2015-07-30 14:54:12 发布

阅读量121

点赞数

文章标签： prototype

本文链接：https://blog.csdn.net/iteye_19781/article/details/81895186

版权

一种网上常见的方法是这样的：


   1. var pro = window.HTMLElement.prototype;  
   2. pro.__defineGetter__("outerHTML", function(){  
   3.     var str = "<" + this.tagName;  
   4.     var a = this.attributes;  
   5.     for(var i = 0, len = a.length; i < len; i++){  
   6.         if(a[i].specified){  
   7.             str += " " + a[i].name + '="' + a[i].value + '"';  
   8.         }  
   9.     }  
  10.     if(!this.canHaveChildren){  
  11.         return str + " />";  
  12.     }  
  13.     return str + ">" + this.innerHTML + "</" + this.tagName + ">";  
  14. });  
  15. pro.__defineSetter__("outerHTML", function(s){  
  16.     var r = this.ownerDocument.createRange();  
  17.     r.setStartBefore(this);  
  18.     var df = r.createContextualFragment(s);  
  19.     this.parentNode.replaceChild(df, this);  
  20.     return s;  
  21. });  
  22. pro.__defineGetter__("canHaveChildren", function(){  
  23.     return !/^(area|base|basefont|col|frame|hr|img|br|input|isindex|link|meta|param)$/.test(this.tagName.toLowerCase());  
  24. });

不过感觉getter实现方法应该这样：clone当前div，放入一个tempdiv中，然后取tempdiv的innerHTML这样效率应该高很多

setter实现方法：也可以放入div中循环appendChild节点，不过效率没有createContextualFragment这种高

没深入研究，欢迎指导