4

この関数を見つけました（ただし、場所は忘れました）：

function outerHTML(node){
    // if IE, Chrome take the internal method otherwise build one
  return node.outerHTML || (
      function(n){
          var div = document.createElement('div'), h;
          div.appendChild( n.cloneNode(true) );
          h = div.innerHTML;
          div = null;
          return h;
      })(node);
}

しかし、この関数は呼び出すouterHTML(my_element)のではなく呼び出すことで機能しますmy_element.outerHTML

javascript DOM要素オブジェクトをouterHTML要素を持つように拡張できるようにしたいのですが、ネイティブ要素が存在する場合は引き続き使用します。それ、どうやったら出来るの？

私がこのようにしたい主な理由は、Firefox が outerHTML メソッドをネイティブに持っていないためですが、十分にテストされており、信頼できると感じているため、可能な場合はネイティブ実装を使用したいと考えています。

更新: @Raynos は、outerHTML に対して上記を行わないことを提案しました。outerHTML 仕様のようなことを行う必要があります。私はこれを見つけました: Firefox で OuterHTML を行うにはどうすればよいですか? また、FireFox 8.0.1 でエラーを引き起こす可能性がある .cloneNode を実行しません。
@Raynosによると、私の解決策はこれです：

if (!("outerHTML" in HTMLElement.prototype)) {
    Object.defineProperty(HTMLElement.prototype, "outerHTML", {
        get: getOuterHTML
    });
}


function getOuterHTML(){
    var parent = this.parentNode;
    var el = document.createElement(parent.tagName);
    el.appendChild(this.cloneNode(true));
    var shtml = el.innerHTML;
    return shtml;
}
4

3 に答える 3

8

あなたは一般的に次のようなことをします：

if (!("outerHTML" in document.body)) {
    Object.defineProperty(Element.prototype, "outerHTML", {
        get: getOuterHTML,
        set: setOuterHTML
    });
}

次に、 outerHTML仕様を読み取り、それを実装する関数を記述getOuterHTMLします。setOuterHTML

注：outerHTML仕様に準拠していないプロパティを単純に実装しないことを強くお勧めします。これにより、「バージョン」の動作がネイティブバージョンと異なる場合に、メンテナンスで問題が発生します。特に、独自の拡張機能や追加の「機能」をバージョンに追加する場合

Object.defineProperty古いブラウザでは定義されていないことに注意してください。es5-shimのshimを使用する必要がある場合があります

于 2011-12-12T19:51:48.650 に答える
1

HTMLElementプロトタイプに追加します

HTMLElement.prototype.outerHTML =  function() {
      // Your implementation of getting outerHTML
}
于 2011-12-12T19:45:15.023 に答える
0

ほぼすべての DOM が拡張されている Node ベース オブジェクトを拡張してみてください。要素要素の説明についてはこちらをお読みください - MDNまたは、他の回答者がMDN からも HTMLElement をお読みください - HTMLElementを試してください。

Element.prototype.outerHTML = function(){ console.log('hola'); };
HTMLElement.prototype.outerHTML = function(){ console.log('hola'); };

ここで指摘されたコメントの Raynos はSpecの記事であり、 Element の使用を奨励しています。

編集：削除されたノード参照

于 2011-12-12T20:14:07.973 に答える