16

これは非常に単純か不可能です。

私はこれを行うことができることを知っています:

var element = document.getElementById('some_element');
element.parentNode.removeChild(element);

…が、ぐちゃぐちゃな感じ。同じことを行うための、より整然とした、そして普遍的にサポートされている方法はありますか?

少なくとも私には、次のようなものがあるはずです：

document.getElementById('some_element').remove();

...しかし、それは機能せず、Google/SO を検索しても代替手段は得られませんでした。

それほど重要ではないことはわかっていますが、parentNode.removeChild()ハッキー/面倒/非効率的/悪い習慣のように感じます。

4

3 に答える 3

34

少し面倒に見えるかもしれませんが、それは親から要素を削除する標準的な方法です。DOM要素自体は、なしで単独で存在できるため、メソッドが親上にあるparentNodeことは理にかなっています。removeChild

DOMノード自体のIMOジェネリック.remove()メソッドは誤解を招く可能性があります。結局のところ、要素をその親から削除するのではなく、存在から削除するわけではありません。

ただし、この機能用に独自のラッパーをいつでも作成できます。例えば

function removeElement(element) {
    element && element.parentNode && element.parentNode.removeChild(element);
}

// Usage:
removeElement( document.getElementById('some_element') );

または、jQueryのようなDOMライブラリを使用して、jQueryのように一連のラッパーを提供します。

$('#some_element').remove();

この編集は、ネイティブDOM実装を拡張する可能性について質問したコメントに対応しています。これは悪い習慣と見なされているため、代わりに、要素を含む独自のラッパーを作成してから、必要なメソッドを作成します。例えば

function CoolElement(element) {
    this.element = element;
}

CoolElement.prototype = {
    redify: function() {
        this.element.style.color = 'red';
    },
    remove: function() {
        if (this.element.parentNode) {
            this.element.parentNode.removeChild(this.element);
        }
    }
};

// Usage:

var myElement = new CoolElement( document.getElementById('some_element') );

myElement.redify();
myElement.remove();

これは本質的にjQueryが行うことですが、上記のような個々の要素ではなくDOMノードのコレクションをラップするため、少し高度です。

于 2011-09-26T21:07:27.070 に答える
1

あなたのコードはそれを行うための正しくて最良の方法です。

jQueryにはあなたが探しているものがあります：

$("#someId").remove();
于 2011-09-26T21:05:57.130 に答える