ize*_*zee 0 javascript listitem html-lists
我是学习 Javascript 的新手。我想删除无序列表中的特定列表项。每个项目都有一个删除按钮，我只是不知道我的按钮如何知道我在不使用索引的情况下选择了他们的项目。
let enterListBtn = document.getElementById("enter");
let input = document.getElementById("userinput");
let ul = document.querySelector("ul");
let togList = document.getElementsByTagName("li");
let deleteBtn = document.getElementById("delete");
function deleteItem() {
togList.parentNode.removeChild(togList);
}
deleteBtn.addEventListener("click", deleteItem);
超文本标记语言
<body>
<h1>Shopping List</h1>
<p id="first">Get it done today</p>
<input id="userinput" type="text" placeholder="enter items">
<button id="enter">Enter</button>
<ul>
<li>Notebook <button id="delete">Delete</button></li>
<li>Jello <button>Delete</button></li>
<li>Spinach <button>Delete</button></li>
<li>Rice <button>Delete</button></li>
<li>Birthday Cake <button>Delete</button></li>
<li>Candles <button>Delete</button></li>
</ul>
<script type="text/javascript" src="script.js"></script>
</body>
只需为每个删除按钮添加一个类，在 jquery 添加单击事件方法中，然后获取按钮的父级将其删除..检查此代码..
$('.delete').on('click', function(){
$(this).parent().remove();
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<h1>Shopping List</h1>
<p id="first">Get it done today</p>
<input id="userinput" type="text" placeholder="enter items">
<button id="enter">Enter</button>
<ul>
<li>Notebook <button class="delete">Delete</button></li>
<li>Jello <button class="delete">Delete</button></li>
<li>Spinach <button class="delete">Delete</button></li>
<li>Rice <button class="delete">Delete</button></li>
<li>Birthday Cake <button class="delete">Delete</button></li>
<li>Candles <button class="delete">Delete</button></li>
</ul>
</body>| 归档时间： |
|
| 查看次数： |
10703 次 |
| 最近记录： |