innerHTMLの使い方

JavaScriptから特定の要素のテキストを書き換えるのにinnerHTMLを使っています。
innerHTMLで書き換える際に、HTMLタグを文字列連結するのはあまりよろしくないみたいです。

ということで、自分なりに考えてコードを書いてみました。
どれがいいかは、時と場合によって変わりそうです。

/* タグ込みで書き換え */

var innerHTML1 = function(){

    var divhoge = document.getElementById('hoge');

    divhoge.innerHTML = "
Foo Bar
";

}
/* childNodesのinnerHTMLを書き換え */

var innerHTML2 = function(){

    var divhoge = document.getElementById('hoge');

 var phoge = divhoge.childNodes[0];

    phoge.innerHTML = "Foo Bar";

}
/* childNodesを削除して、p要素を再作成 */

var innerHTML3 = function(){

    var divhoge = document.getElementById('hoge');

    var element = document.createElement('p');

 element.innerHTML = "Foo Bar";

 divhoge.removeChild(divhoge.firstChild);

 divhoge.appendChild(element);

}

「集合知プログラミング」を読み進めてはいるものの、数学苦手な人間には内容が難しく、
読み解くのに時間がかかっています。
ということで、JavaScriptで気晴らししてみました。