时间戳

首页 > 解决方案 > 如何在 javascript 中制作和编辑 Html div

javascript - 如何在 javascript 中制作和编辑 Html div

问题描述

试图在已经使用 javascript 制作的 div 中制作 Html div，但我的函数有问题。

html部分

<div id="test">
<button onclick="addDiv()">test</button>
</div>

js部分

let page = document.querySelector('test');

function addDiv() {
    document.createElement('div')
    document.querySelector('page')
    addedDiv = document.appendChild('div')
    page = document.appendChild('div')
    document.getElementById('div').innerHTML = "ThisFunctionIsWorking"
}

应在控制台中看到输出，其中 div 内的文本显示 ThisFunctionIsWorking 但我收到错误消息（无法在“节点”上执行“appendChild”：参数 1 不是“节点”类型。）

我会很感激你的时间帮助我...

标签： javascriptappend

解决方案

您的代码在很多方面都不正确。我建议你学习基础（Web）编程，重点是返回值、范围等基础知识，然后是基础的 javascript 和 dom 树操作。

您的问题的解决方案是：

<div id="test">
<button onclick="addDiv('test')">test</button>
</div>

function addDiv(nodeId) {
    var elem = document.createElement('div')
    var container = document.getElementById(nodeId)
    container.appendChild(elem)
    elem.innerHTML = "ThisFunctionIsWorking"
}

推荐阅读