Javascript 从本地存储中删除整个阵列

如何在没有localStorage.clear的情况下完全删除localStorage；方法

我有一个购物车，你可以在那里储存你要买的产品，然后在本地储存。当前，清除购物车按钮与localStorage.Clear一起使用；方法，但我还有一个表，您可以在其中删除单个产品。但是，如果使用同一行上的“删除”按钮删除整个表，而该表恰好是最后一个产品，则本地存储仍将有一个空数组，并被视为非空

这是我删除项目的方法：

function removeItem(itemId) {
//removes the parent row of table
$('#product-table').on('click', '.remove-item', function(e) {
    $(this).closest('tr').remove();
});

var index = -1;
var obj = JSON.parse(localStorage.getItem("items")) || {}; //fetch cart from storage
var items = obj || []; //get the products
$.each(items, function(key, value) {
    if (key === itemId) {
        items.splice(key, 1); //remove item from array
    }
});
localStorage.setItem("items", JSON.stringify(obj)); //set item back into storage

sum = 0;
$.each(items, function(key, value) {
    sum += value.itemPrice;
});
$("#summary").html(sum.toFixed(2) + "€");
updateCartCount();
}

它可以正确地删除项目，但每当我删除最后一个产品时，都会删除table元素，并添加一个段落，说明您的购物车是空的。回到商店

以下功能如下：

function hideElements() {
if ($(".cart-wrapper").length) {
    if (localStorage.getItem("items") === null) {
        $("#products").css("display", "none");
        $("#empty").css("display", "block");
        $(".btn-clear").css("display", "none");
    } else {
        $("#products").css("display", "block");
        $("#empty").css("display", "none");
        $(".btn-clear").css("display", "block");
    }
}
}

hideElements函数不会将本地存储识别为空，因为它显示存在空数组对象

如果移除的产品是购物车上的最后一个产品，如何通过移除整个本地存储来实现这一点？我试用了localStorage.getItemsitems.length！=0等等都没有用

下图显示我的空本地存储：

function loadItems() {
  // Returns the value of items, or an empty array.
  return JSON.parse(localStorage.getItem("items") || "[]");
}

function saveItems(itemsArr) {
  localStorage.setItem("items", JSON.stringify(itemsArr));
}

// Remove item with given ID (assuming each element in the array is e.g. `{id: 123}`)
const itemId = 123;
saveItems(loadItems().filter(item => item.id !== itemId));

// Update cart HTML elements:
if ($(".cart-wrapper").length) {
  const haveItems = loadItems().length > 0;
  $("#products").toggle(!haveItems);
  $("#empty").toggle(haveItems);
  $(".btn-clear").toggle(!haveItems);
}

---

您可能正在查找localStorage.removietem

更好的是，您应该重构内容，这样就有了专门负责管理本地存储中项目阵列的功能：

function loadItems() {
  // Returns the value of items, or an empty array.
  return JSON.parse(localStorage.getItem("items") || "[]");
}

function saveItems(itemsArr) {
  localStorage.setItem("items", JSON.stringify(itemsArr));
}

// Remove item with given ID (assuming each element in the array is e.g. `{id: 123}`)
const itemId = 123;
saveItems(loadItems().filter(item => item.id !== itemId));

// Update cart HTML elements:
if ($(".cart-wrapper").length) {
  const haveItems = loadItems().length > 0;
  $("#products").toggle(!haveItems);
  $("#empty").toggle(haveItems);
  $(".btn-clear").toggle(!haveItems);
}

---

您可能正在查找localStorage.removietem

更好的是，您应该重构内容，这样就有了专门负责管理本地存储中项目阵列的功能：

function loadItems() {
  // Returns the value of items, or an empty array.
  return JSON.parse(localStorage.getItem("items") || "[]");
}

function saveItems(itemsArr) {
  localStorage.setItem("items", JSON.stringify(itemsArr));
}

// Remove item with given ID (assuming each element in the array is e.g. `{id: 123}`)
const itemId = 123;
saveItems(loadItems().filter(item => item.id !== itemId));

// Update cart HTML elements:
if ($(".cart-wrapper").length) {
  const haveItems = loadItems().length > 0;
  $("#products").toggle(!haveItems);
  $("#empty").toggle(haveItems);
  $(".btn-clear").toggle(!haveItems);
}

---

localstorage.get返回的是字符串而不是JSON，因此您需要做的是解析字符串，即localstorage.getItem'items'返回长度等于2的[]。您需要做的是JSON.parselocalstorage.getItem'item.length

localstorage.get返回的是字符串而不是JSON，因此您需要做的是解析字符串，即localstorage.getItem'items'返回长度等于2的[]。您需要做的是JSON.parselocalstorage.getItem'item'.length

.removeItem'items'和if localStorage.GetItemItemItems？由于localStorage项始终是字符串，检查字符串的长度而不对其进行分析将给出错误的结果，因为空数组的长度为0，但表示空数组[]的字符串的长度为2..removeItem'items'，如果localStorage.GetItemItemItems？由于localStorage项始终是字符串，检查字符串的长度而不对其进行分析将给出错误的结果，因为空数组的长度为0，但表示空数组[]的字符串的长度为2。实际上，这在我的情况下是有效的；如果JSON.parselocalStorage.getItem'items'.length==0{clearCart；}实际上这对我的案例有效，则修改为此代码；如果JSON.parselocalStorage.getItem'items'.length==0{clearCart；}，则修改为此代码