HTML | DOM 本地存储 clear() 方法

简介

clear() 方法是HTML DOM (文档对象模型) 中本地存储对象的一个方法。它用于从本地存储中清除所有的键和值。

本地存储是一种用于在Web浏览器中存储和检索数据的机制。它允许开发者利用浏览器为每个域名提供的存储空间，将数据存储在用户的设备上。本地存储使得数据的持久存储变得非常容易，并且可以在会话之间进行保留。

本地存储基于键值对的存储结构，每个键对应一个唯一的值。通过使用clear()方法，可以一次性清除所有的键和值，而不必逐个删除。

语法

下面是clear()方法的语法：

localStorage.clear();

示例

以下示例演示了如何使用clear()方法从本地存储中清除所有的键和值：

// 存储一些数据
localStorage.setItem('name', 'John');
localStorage.setItem('age', '30');
localStorage.setItem('city', 'New York');

// 在清除之前，输出存储的数据
console.log(localStorage.getItem('name'));  // 输出: John
console.log(localStorage.getItem('age'));   // 输出: 30
console.log(localStorage.getItem('city'));  // 输出: New York

// 清除所有的键和值
localStorage.clear();

// 在清除之后，尝试输出之前存储的数据
console.log(localStorage.getItem('name'));  // 输出: null
console.log(localStorage.getItem('age'));   // 输出: null
console.log(localStorage.getItem('city'));  // 输出: null

在以上示例中，首先使用setItem()方法向本地存储中添加了三个键值对。然后，使用clear()方法清除了所有的键和值。最后，尝试获取之前存储的数据时，发现值为null，说明所有数据已被清除。

注意事项

• 使用clear()方法会将所有的键和值从本地存储中删除，且无法恢复，请在调用该方法前谨慎考虑。
• clear()方法只作用于调用它的本地存储对象（例如：localStorage），其他本地存储对象（如：sessionStorage）不会受到影响。
• 本地存储是基于域名的，不同的域名之间的本地存储是隔离的，因此在不同的域名下调用clear()方法不会相互干扰。

希望以上内容能帮助您理解和使用clear()方法来清除本地存储中的键和值。如果您希望了解更多关于HTML DOM本地存储的信息，请参阅相关文档。