从存储在会话存储中的不断增长的数组中删除 1 项答案

【问题标题】：Removing 1Item from a Growing Array stored in Session Storage从存储在会话存储中的不断增长的数组中删除 1 项
【发布时间】：2022-06-15 10:26:02
【问题描述】：

所以我有一个存储在会话存储中的数组，该数组不断增加，例如将项目添加到购物车，在本例中是一个音乐列表。我有这个以表格格式显示。我的表在一个 For 循环中，对于循环的每次迭代，一个行由项目属性组成（它们存储在会话存储中的数组中），这是标题：，艺术家：，专辑：，流派：和每个项目的末尾有一个编辑和删除按钮。基本上我希望删除按钮能够工作。我希望“删除”按钮仅删除数组的那一行/项，而不是整个数组。我的数组与 Key[musicList] 一起存储，值看起来像下面的代码（它在一个数组中）：

[{title: "Rainbow", artist: "Jane", album: "SunnyBox", genre: "Melody"},…]

0: {title: "Rainbow", artist: "Jane", album: "SunnyBox", genre: "Melody"}

album: "SunnyBox"

artist: "Jane"

genre: "Melody"

title: "Rainbow"

1: {title: "Blue", artist: "Joe", album: "Azure Sea", genre: "Rock"}

2: {title: "Gear", artist: "Romero", album: "Basset", genre: "Metal"}

3: {title: "Amber", artist: "Amy", album: "Amy Coll", genre: "Soul pop"}

这是浏览器中的代码图片。 Music Table List in Browser

这是应该删除数组的 1 项的代码部分，但它不起作用，因为数组也正在使用新项进行更新：

    //This code is the Remove buttons EventListener
    button2.addEventListener("click", function(){
        let arrayOfMusic = JSON.parse(sessionStorage.getItem("musicList"));
        arrayOfMusic.splice([i], 1);
        sessionStorage.setItem('musicList',JSON.stringify(musicList));
    })

这是与音乐表有关的其余代码的图片。 Music Table List JavaScript

请有人帮忙。

【问题讨论】：

标签： javascript arrays session-storage

【解决方案1】：

<button id="btn1">ClickMe</button>
<script>
sessionStorage.setItem("musicList", JSON.stringify([
{title: "Blue", artist: "Joe", album: "Azure Sea", genre: "Rock"}, 
{title: "Gear", artist: "Romero", album: "Basset", genre: "Metal"},
{title: "Amber", artist: "Amy", album: "Amy Coll", genre: "Soul pop"} ]));

document.write(sessionStorage.getItem("musicList"));

let button2=document.getElementById("btn1");
button2.addEventListener("click", ()=>{
let music=JSON.parse(sessionStorage.getItem("musicList"));
music=music.splice(1);

sessionStorage.setItem("musicList", JSON.stringify(music));
console.log(sessionStorage.getItem("musicList"));
})

</script>

【讨论】：