Question

我试图在单击按钮后将按钮“编辑”和“删除”添加到列表元素。我已经添加了2个按钮来列出元素，并在btnedit和btndelete类中将它们的显示设置为none：

function Add(){
    let li = document.createElement('li');
    let a = document.createElement('a');
    let button1 = document.createElement('button');
    let button2 = document.createElement('button');
    button1.innerHTML = "Edit";
    button2.innerHTML = "Delete";
    button1.setAttribute('class','BtnEdit');
    button2.setAttribute('class','BtnDelete');
    let input = document.getElementById('AddText').value;
    if (input.length < 3){
        alert('Must be longer than 3');
    }
    else if(input.length > 255){
        alert('Cant be longer than 255');
    }
    else {
        if (checkDate()!=null) {
            let date = checkDate();
            let t = document.createTextNode(`${input}   ${date}`);
            let test = new storage1(input,date);
            store(test);
            li.appendChild(a);
            a.appendChild(t);
            document.getElementById("myList").appendChild(li).appendChild(a);
            li.appendChild(button1);
            li.appendChild(button2);
        }
    }

在此功能中，当我单击列表元素时，我会更改其背景颜色：

    let list = document.querySelector('ul');
    list.addEventListener('click', function(ev) {
        if (ev.target.tagName === 'LI') {
            ev.target.classList.toggle('checked');


        }
    }, false);

但是我不知道如何现在显示按钮

Answer 1

更改显示：

button1.style.display = "inline";

或删除课程：

button1.classList.remove("BtnEdit");

单击JavaScript中的列表后添加按钮

1 个答案: