FF의 outerHTML

인터넷에서 흔히 볼 수 있는 방법은 다음과 같다.

   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에 넣고 append Child 노드를 순환할 수도 있지만 효율은createContextualFragment와 같은 높지 않다
깊이 연구하지 못했으니 지도를 환영합니다