Javascript 从对象数组中删除元素onClick

我正在做从奥丁项目网站图书馆项目，我有困难完成它。我的想法是访问对象库数组中的卡片特定索引，但这样做有困难。我的想法是使用一个函数，从它在数组中的位置（例如索引）创建某种类型的id，并将其用作对“删除”按钮的访问。有什么建议吗？我很感激你在这里的时间是我的

您可以将库声明从const更改为let

然后，您可以将书籍与其对应的deleteBtn推到一起，这样您就可以轻松删除与单击的deleteBtn对应的条目

然后您可以像这样在deleteBtn上添加事件侦听器

deleteBtn.addEventListener('click', event => {
  event.target.parentNode.remove();
  library = library.filter(v => v[1] !== event.target);
});

其中第一行从DOM中删除元素，第二行创建新的库数组，而不包含删除的条目

功能书名、作者、页数{ this.title=标题； this.author=作者； this.pages=页面； } //丛书 让库=[]； //隐藏和取消隐藏窗体 常量隐藏==>{ var form=document.querySelectorhide； 如果form.style.display==无{ form.style.cssText= 显示：块；显示：柔性；对齐内容：中心；页边距底部：150px； }否则{ form.style.display=无； } }; //创建表单、接受输入、创建卡片、重置并在完成时运行隐藏功能 const addBookCard===>{ const bookName=document.querySelector'input[name=bookName]'。值； const authorName=document.querySelector'input[name=authorName]'。值； const numPages=document.querySelector'input[name=numPages]'。值； //只是说明函数中使用的变量 const container=document.querySelector.flex-row； const createCard=document.createElementdiv； const divTitle=document.createElementp； const divAuthor=document.createElementp； const divPages=document.createElementp； const deleteBtn=document.createElementbutton； library.push[newbookname，authorName，numPages，deleteBtn]； deleteBtn.addEventListener'click'，事件=>{ event.target.parentNode.remove； library=library.filterv=>v[1]！==event.target； }; //使用css文件中的类 createCard.classList.addcard； createCard.setAttributeid，id_num deleteBtn.setAttribute'id'，'delBtn' //正在从库中获取所有信息 divTitle.textContent=标题：+bookName divAuthor.textContent=作者：+authorName divPages.textContent=页数：+numPages deleteBtn.textContent=删除本书； //将其全部添加到我的html中 container.appendChildcreateCard； createCard.appendChilddivTitle； createCard.appendChilddivAuthor； createCard.appendChilddivPages； createCard.appendChilddeleteBtn； document.getElementByIdformReset.reset； 隐藏 返回错误 }; var btn=document.querySelector'newCard'； btn.onclick=addBookCard； 功能你好{ 对于变量i=0；i作者名称：谢谢你帮我把它分解了，马图斯！在中的筛选器方法内部到底发生了什么。除了在函数中使用“v[1]”之外，我完全理解，为什么选择1而不是像i或任何其他数字一样的东西？@joseperez筛选器一次处理给定数组的每个元素，您不需要指定该元素的索引。但是，本例中的每个元素都是由两个元素组成的另一个数组-[new BookbookName、authorName、numPages、deleteBtn]第一个是图书条目，第二个是相应的delete按钮。v[1]以该两元素数组中的按钮为目标。

library.push([new Book(bookName, authorName, numPages), deleteBtn]);

deleteBtn.addEventListener('click', event => {
  event.target.parentNode.remove();
  library = library.filter(v => v[1] !== event.target);
});