javascript - 使用 JavaScript 添加带有变量的 HTML

Question

我试图让我的 JavaScript 打印一个变量和一些文本，我有一个例子(我认为它不起作用......):

CSS

.container {
  border: 2px solid #dedede;
  background-color: #f1f1f1;
  border-radius: 5px;
  padding: 10px;
  margin: 10px 0;
}
  @font-face {
  font-family: Superfont;
  src: url(Suplexmentary_Comic_NC.ttf);
  }
.name{
  font-size: 6px;
  border-style: solid;
  border-color: red;
}
.message{
  font-family: Superfont;
}

Java

let addthistext = "hi"
document.getElementById("parentID").appendChild(<div class="container">
    <p class="name">member</P>
    <p class="message">text</p>
  </div>)

你能尝试想出一个答案吗？

Answer 1

几乎正确，需要创建新的元素

let addthistext = "hi";
let el = document.createElement('p');
el.innerText = addthistext;
el.classList.add("text");
document.getElementById("parentID").appendChild(el)

.text{
font-family: "Times New Roman", Times, serif;
}

<div id='parentID'></div>