innerHTMLに変数を挿入する

Question

id = "here"に表示されるテーブルを作成しようとしています。

問題は、テーブルの見出し（th）の内側に「var i」を配置する必要があることです。

実行時に表が表示されません - これは、 "var i"を追加すると文字列が折れるためです。

これを回避する手段はありますか？このようなテーブルに変数を挿入する方法は知られていますか？

どれ/すべてのヘルプは高く評価され:)

<p id="here"></p> 
<button type="button" onclick="test();"></button> 

<script> 

var i = Dogs; 
function test() {document.getElementById("here").innerHTML = 
"<table><tr><th>" + i + "</th></tr></table>";} 

</script> 

Answer 1

は犬に引用符を追加します。文字列リテラルには引用符が必要です。

var i = "Dogs"; 
 
function test() {document.getElementById("here").innerHTML = 
 
"<table><tr><th>" + i + "</th></tr></table>";}

<p id="here"></p> 
 
<button type="button" onclick="test();">click me</button>

Answer 2

私が代わりに子供を追加使用します。それは、文字列ではありませんので、

var table = document. createElement("table") 
document.getElementById("hello").appendChild(table) 

...ように等々