我想在没有jQuery的情况下从javascript附加html

Question

我想在没有jQuery的情况下从javascript附加html

.appendChild对我不起作用，我要做的就是将我的javascript const bottomText中的html代码附加到没有jQuery的DOM中

   const bottomText = `
        <div class="bottom-text row">
          <div class="column column-left">test
            <p>xx%<span></span></p>
          </div>
          <div class="column column-right">
          <p>test</p>
          </div>
        </div>
        <hr>
        `;
document.getElementById("piechart").appendChild(bottomText);

Run Code Online (Sandbox Code Playgroud)

和我的HTML

<body>
    <div class="graphs">
        <div class="pie-chart" id="piechart">
        </div>
        <script src="./js/pie.js"></script>
        <script src="./js/linegraph.js"></script>
    </div>
</body>

Run Code Online (Sandbox Code Playgroud)

为什么不起作用？与jQuery的作品，但对于这个项目，他们希望我只使用香草JS

Answer 1

Mah*_*Ali 5

appentChild()将Node作为参数。如果要添加包含的字符串，可以使用insertAdjacentHTML()

document.getElementById("piechart").insertAdjacentHTML("beforeend",bottomText);

Run Code Online (Sandbox Code Playgroud)

MDN文件：https：//developer.mozilla.org/zh-CN/docs/Web/API/Element/insertAdjacentHTML

归档时间：	7 年，1 月前
查看次数：	65 次
最近记录：	7 年，1 月前