JavaScriptで新しい要素を作成して追加する方法

📌

結論

createElement + appendChild で要素を動的に追加できます

📝 実際のコードはこちら

const li = document.createElement('li');
li.textContent = '新しい項目';
document.getElementById('list').appendChild(li);

まとめ

・createElement で要素を作る・appendChild で親に追加・TODOリストなど動的UIの基本

createElement+appendChildで要素を追加してみましょう。

🧪 ここで試せます ─ 壊しても大丈夫！

下のエディタで実際にコードを書いて、すぐにプレビューで確認できます。何度でもやり直せるので、思い切って色々試してみてください。

■ 演習

pタグを作り、テキストを新規にして、idがcontainerの要素の子として追加してください。

詰まったらヒント

document.createElement, appendChild