div要素を親として挿入する

Question

次のことが可能かどうか疑問に思っています.DOM要素があり、この要素をdivにラップしたいとします。したがって、要素とその親の間にdivが挿入されます。次にdivは要素の新しい親になります。

しかし、物事を複雑にするために、他の場所で我々はすでにのようなもの行っている：テストIDはdiv要素でwarappedされる要素の子である

var testElement = document.getElementByID('testID') 

を。したがって、挿入が完了した後も、testElementは有効ですか？

私はjqueryを使用していません。

アイデア？はい - あなたは（innerHTMLプロパティではなく）標準のDOMメソッドを使用して操作を行っていると仮定すると、

おかげで、

AJ

Answer 1

をあなたはreplaceChild^[docs]を使用することができます。

// `element` is the element you want to wrap 
var parent = element.parentNode; 
var wrapper = document.createElement('div'); 

// set the wrapper as child (instead of the element) 
parent.replaceChild(wrapper, element); 
// set element as child of wrapper 
wrapper.appendChild(element); 

限り、あなたは、REFEを（破壊し、要素を作成します）innerHTMLを使用していないとして、既存のDOM要素の変更は変更されません。ここで

var wrapper = document.createElement('div'); 
var myDiv = document.getElementById('myDiv'); 
wrapper.appendChild(myDiv.cloneNode(true)); 
myDiv.parentNode.replaceChild(wrapper, myDiv); 

Answer 2

。

移動要素は、それらへの直接参照を壊すことはありません。

（あなたがinnerHTMLプロパティを使用していた場合、あなたは上のそのプロパティを設定された要素の内容を破棄し、新しいコンテンツを作成することになる）

あなたはおそらく何かしたい：

var oldParent = document.getElementById('foo'); 
var oldChild = document.getElementById('bar'); 
var wrapper = document.createElement('div'); 
oldParent.appendChild(wrapper); 
wrapper.appendChild(oldChild); 

Answer 3

は...別の例である、唯一の新しい要素は、その子要素の「すべては」ラップアラウンドします。

必要に応じてこれを変更して、異なる範囲で折り返すようにすることができます。この特定の話題には多くの解説はありませんので、うまくいけば皆に助けになるでしょう！

var newChildNodes = document.body.childNodes; 
var newElement = document.createElement('div'); 

newElement.className = 'green_gradient'; 
newElement.id = 'content';   

for (var i = 0; i < newChildNodes.length;i++) { 
    newElement.appendChild(newChildNodes.item(i)); 
    newChildNodes.item(0).parentNode.insertBefore(newElement, newChildNodes.item(i)); 
} 

あなたはあなたの新しい要素の親がなるものは何でもするnewChildNodes変数の「document.body」の部分を変更したいと思うでしょう。この例では、ラッパーdivを挿入することを選択しました。また、要素の型とidとclassNameの値を更新する必要があります。

Answer 4

あなたはこのような何かを試すことができ、純粋なJSで