Javascript 删除不同ID的列表按钮

你好，我正在尝试制作3个无序列表，其中有一个删除按钮。一旦我点击删除图标，它就会删除（display:none）该列表，其他两个应该保持不变。我可以通过3种不同的功能实现此功能。但是，我想用一个函数来实现这个结果。请提供帮助，我只想在这里使用javascript，而不是jQuery或angular。这是我的密码-

第一名单

<ul class="board" id="today_list">
    <h4>Today <span class="delete_list" onclick="deleteList()">delete</span></h4>
    <li id="ta">Today's Task 1</li>
</ul>

---

这是工作代码-

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

以下是工作代码-

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

在onclick函数中传递

id名称，并将id设置为javascript

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

在onclick函数中传递

id名称，并将id设置为javascript

函数删除列表（id）{
var deleteList=this.document.getElementById（id）；
deleteList.style.display=“无”；
}

今天删除
今天的任务1


今天删除
一周的任务1


今天删除
一个月的任务1

功能删除列表（btn）{
btn.parentNode.parentNode.style.display=“无”
}

今天删除
今天的任务1

功能删除列表（btn）{
btn.parentNode.parentNode.style.display=“无”
}

今天删除
今天的任务1

---

将id传递给函数onclick=“deleteListMonth（'month_list'）”，然后传递给函数deleteList（id）{var deleteList=this.document.getElementById（id）；将id传递给函数onclick=“deleteListMonth（'month_list'）”，然后传递给函数deleteList（id）{var deleteList=this.document.getElementById（id）；非常感谢！非常出色。还有其他人，请不要忘记删除列表（“今日列表”）中的“”，否则会出现错误。非常感谢！非常出色。还有其他人，请不要忘记删除列表（“今日列表”）中的“”或者它会给出错误。您可以使用

this.parentNode.parentNode.id

使其更具动态性。将其与deleteList一起传递为-

deleteList（this.parentNode.parentNode.id）

在所有onclick中都将动态传递相应的id。您可以使用

this.parentNode.parentNode.id

使其更具动态性。在所有onclick中，将其与deleteList一起传递为-

deleteList（this.parentNode.parentNode.id）

将动态传递相应的id。

<ul class="board" id="week_list">
    <h4>Today <span class="delete_list" onclick="deleteListWeek()">delete</span></h4>
    <li id="wa">Week's Task 1</li>
</ul>

<ul class="board" id="month_list">
    <h4>Today <span class="delete_list" onclick="deleteListMonth()">delete</span></h4>
    <li id="ma">Month's Task 1</li>
</ul>

function deleteList(){
    var deleteList = this.document.getElementById('today_list');
    deleteList.style.display = "none";
}

//you can pass this id of the list in the function itself:

function deleteList(btn){
    btn.parentNode.parentNode.style.display = "none"
}

<ul class="board" id="today_list">
<h4>Today <span class="delete_list" onclick="deleteList(this)">delete</span></h4>
<li id="ta">Today's Task 1</li>