実現したいこと
テンプレートリテラルにhtmlコードを記入し、それを出力をしたいです。
前提
テンプレートリテラルについて学習をしております。
テンプレートリテラルにhtmlの要素を記述し、それらが文字列として出力を行うことは出来ました。
しかしhtmlの要素として出力する方法がわかりません。
発生している問題・エラーメッセージ
index.html:23 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
該当のソースコード
html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5 <meta charset="UTF-8"> 6 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 7 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 8 <title>Document</title> 9</head> 10 11<body> 12 13 <script> 14 const template = ` 15 <a href=""> 16 <span class="btn"> 17 </span> 18 </a> 19`; 20 const body = document.querySelector("body"); 21 body.appendChild(template); 22 </script> 23</body> 24 25</html>
試したこと
creatTextNodeでテキストとして吐き出されることは確認しました。
エラーの文面のNodeではないとあるので、Nodeであれば出力可能なのかと思っています。
何か方法がございましたら、ご教授いただけますと幸いです。
テンプレートリテラルの練習でしたら課題要件変えた方が良いと思います。
リテラル、つまり単なる文字列なので。

回答1件
あなたの回答
tips
プレビュー