Shammer's Philosophy

My private adversaria

JavaScriptでHTML要素を置換する

document.getElementById($ID).innerHTML で HTML 内の文字列を取得できることがわかった。
今度は、これを編集して、編集した結果で置換したい。innerHTML にそのまま代入すればいいのだろうか。

<script type="text/javascript">
var array = document.getElementById("sample").innerHTML.split("\n");
var replaced = "";
for( i = 0 ; i < array.length ; i++ ){
  replaced = replaced + array[i] + "<br/>";
}
document.getElementById("sample").innerHTML = replaced;
</script>

うまくいったようだ。オリジナルの HTML は、

<div id="sample">DIV value1
DIV value2
DIV value3</div>

だが、ブラウザでソースを見ると

<div id="sample">DIV value1<br>DIV value2<br>DIV value3<br></div>

となった。成功だ。