1

我想弄清楚，我怎么能用<li>纯 javascript 删除一个特定的？我的目的是：每个<li>都有一个“删除”按钮，如果我们单击该按钮，它将删除该<li>.

function remove(r){
    **REMOVE**
}

function add(){
    var ul = document.getElementById("ul");
    var li = document.createElement("li");

    if(document.getElementById("nameS").value && document.getElementById("mailS").value){
        var nameS = document.createElement("i");
        nameS.innerHTML = document.getElementById("nameS").value;
        nameS.innerHTML += ": ";

        var mailS = document.createElement("font");
        mailS.setAttribute("color","#000080");
        mailS.innerHTML = document.getElementById("mailS").value;
        mailS.innerHTML += " - ";

        if(document.getElementById("webpageS").value){
            mailS.innerHTML += "<a href="+document.getElementById("webpageS").value+">"+document.getElementById("webpageS").value+"</a>";
        }

        var element = document.createElement("input");
        element.setAttribute("type","button");
        element.setAttribute("value","Remover");
        //element.setAttribute("onclick",remove());
        element.addEventListener('click',function(){
               li.remove();
        },false);


        li.appendChild(nameS);
        li.appendChild(mailS);
        li.appendChild(element);
        ul.appendChild(li);
    }


}
4

2 回答 2

2

如果您按照@Eevee 的建议添加remove函数，则传递给的第一个参数将是一个对象。（对于点击事件，它将是一个对象。）addEventListenerremoveEventMouseEvent

每个Event对象都有一个属性 ，target它告诉你元素来自哪里。因此，您可以简单地沿着元素树向上获取li，然后将其删除：

function removeParent(evt) {
  evt.target.parentNode.remove();
}

element.addEventListener('click', removeParent, false);

对您的代码的其他一些评论：

  • 请永远不要使用font元素；同样的i元素。span如果你想应用样式，你应该使用；如果要强调文本，请使用em.
于 2013-11-06T22:02:23.137 回答
1

我要做的是为每个 li 添加一个唯一的 id，您可以稍后引用它来删除它：

var curId = 0;
function add(){
....

var li = document.createElement("li");
li.setAttribute(id,curId)

...

curId++;
}

然后在您的按钮中传递该 ID

element.setAttribute("onclick",remove(curId));

然后对于您的删除功能，它很简单：

function remove(ele){
    ducument.getElementById(ele).remove();
}
于 2013-11-06T21:32:34.543 回答