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

Question

我已通过此代码将 a 添加<p>到 a<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);}'

但它不起作用。

Answer 1

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

上述上下文中的 this.value 指的是Button元素的 value 属性（它是一个字符串），而不是 Button 的 ID。此外，您还没有定义 ID，所以this.id会返回""（一个空字符串）

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

您可以修改remove()以接受对象：

function remove(btn){
    emad.parentNode.removeChild(btn);
}

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