HTML要素の前または後にテキストを追加する

Question

<div>のようなHTML要素がある場合や、この要素の前または後に別の要素を追加することはできますか？

純粋なJavascriptのみを使用したいと思います。以下のような

何か：

<div id="parentDiv"> 
    my text must be added here 
    <div id="childDiv"></div> 
</div> 

Answer 1

はい、あなたは、あなたがのappendChildかのinsertBeforeと、要素のようにそれを挿入することができdocument.createTextNode('the text')

とテキストノードを作成することができます。 #childDivの前にテキストを挿入

例：

var text = document.createTextNode('the text'); 
var child = document.getElementById('childDiv'); 
child.parentNode.insertBefore(text, child); 

Answer 2

あなたはテキストノードを追加することができます。ノード - document.createTextNode('text')を作成して、/ append/replaceを挿入します。必要な操作を行います。

Answer 3

このようなものは、それを行う必要があります。

<script type="text/javascript"> 
    var parent = document.getElementById('parentDiv'); 
    var sibling = document.getElementById('childDiv'); 
    var text = document.createTextNode('new text'); 
    parent.insertBefore(text, sibling); 
</script> 

Answer 4

念のために：

divはあなたです

div.insertAdjacentHTML('beforeBegin', yourText); 

子供 - DIV。 childTagがない場合

var text = document.createTextNode("my text must be added here."); 
    var childTag = document.getElementById("childDiv"); 

    childTag.parentNode.insertBefore(text, childTag.nextSibling); 

：

ライブデモ：前または後にトピックに関して、ユーザーにhttp://jsfiddle.net/ZkzDk/

Answer 5

を挿入するための質問は、ここでは後の例ですinsertBeforeメソッドがこのケースを処理し、それを最後の子として追加するだけなので、大丈夫です。

また、テキストノードを作成した後にappendChild（）メソッドを使用し、parentNode経由でchildTagを追加することもできます。