gpt4 book ai didi

javascript - 如何在按下按钮时创建一个框

转载 作者:行者123 更新时间:2023-11-30 09:18:14 25 4
gpt4 key购买 nike

我想做的是,每当我按下一个按钮时,就会出现一个包含文本的框。创建时应显示框的 HTML。

<div class="trades">
</div>

<button onclick="create()">add</button>

用于创建它的 Javascript 函数

function create() {
var box = document.createElement("div");
creation.setAttribute('class', 'itembox');
creation.setAttribute('id', 'itemBox');
var holder = document.createElement("p");
holder.setAttribute('id', 'output');
var item = document.createTextNode("testing");
holder.appendChild(item);
box.appendChild(holder);
var mainholder = document.getElementByClassName("trades");
}

制作盒子的CSS

.itembox {
border: 1px solid black;
}

最佳答案

稍作修改即可:

function create() {
var box = document.createElement("div");
box.setAttribute('class', 'itembox')
var holder = document.createElement("p");
holder.setAttribute('class', 'output');
// You can set the inner text of the p tag without creating a text node.
holder.innerText = "The text in the box"
box.appendChild(holder);
// Trades should be an element with and ID because you probably only ever want to insert into one place.
var trades = document.getElementById("trades");
trades.appendChild(box);
}
.itembox {
border: 1px solid black;
}
<body>
<div id="trades">
</div>

<button onclick="create()">add</button>
</body>

关于javascript - 如何在按下按钮时创建一个框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53506854/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com