通过创建按钮在JavaScript中删除新创建的元素

Removing a newly created element in JavaScript with creating a button

本文关键字:创建 元素 新创建 按钮 JavaScript 删除      更新时间:2023-09-26

我用这段代码添加了一个<p>到一个<div>,并制作了一个按钮。

var selectedId = this.value;
var divElem = $("#selectedItem");
var bElem = document.createElement("Button");
var bElemInnerHTML = document.createTextNode("Erase");
bElem.addEventListener('click', function () {
    remove(this.value);
}, true);
bElem.appendChild(bElemInnerHTML);
var pElem = document.createElement("p");
var pElemInnerHTML = document.createTextNode(this.value);
pElem.setAttribute('id', selectedId);
alert(pElem.getAttribute('id'));
pElem.style.fontSize = '25px';
pElem.style.textAlign = 'center';
pElem.style.margin = '5px';
pElem.appendChild(pElemInnerHTML);
pElem.appendChild(bElem);
divElem.append(pElem);

我添加到按钮运行remove功能时,点击

function remove(id){
var emad = document.getElementById(id);
emad.parentNode.removeChild(emad);}'

bElem.addEventListener('click', function () {
    remove(this.value);
}, true);

。上面上下文中的value指的是Button元素的value属性(它是一个字符串),而不是Button的ID。此外,您还没有定义ID,因此this.id将返回""(一个空字符串)

bElem.addEventListener('click', function () {
    remove(this.id);
}, true);

你可以修改remove()来接受Object:

function remove(btn){
    emad.parentNode.removeChild(btn);
}
bElem.addEventListener('click', function () {
    remove(this);
}, true);