Nodeを置換する
ベース記事
JavascriptメモDOM操作について
Nodeを置換する方法
replaceChild()を使うと置換することができる。
大まかに言えばappendChild()を使ってノードを追加する方法とほぼ同じ。
違うところは、replaceChild()をの引数は2つあり、newNode, oldNodeの順に引数を渡さなければならない。
参考例
<!DOCTYPE html> <html lang="utf-8"> <head> <meta charset="utf-8"> <title>ノード置換</title> </head> <body> <!--ボタンを押すとリストの内容を取り替えるプログラムを書く--> <ul id="lists"> <li id="curry">おいしいカレー</li> <li id="tako">おいしいたこやき</li> </ul> <input type="button" value="追加" onclick="replacing();"> <script> function replacing(){ var content_list = document.createElement("li"); var text = document.createTextNode("やさいおいしい"); content_list.appendChild(text); var tako = document.getElementById("tako"); lists.replaceChild(content_list, tako); } </script> </body> </html>