JavaScript和jQuery存储localStorage的具体实现方法详解

// 存储字符串
localStorage.setItem('key', 'value');

// 存储对象（需先序列化）
const user = { name: 'John', age: 30 };
localStorage.setItem('user', JSON.stringify(user));

// 读取字符串
const value = localStorage.getItem('key');

// 读取对象（需反序列化）
const userData = JSON.parse(localStorage.getItem('user'));

localStorage.removeItem('key'); // 删除单个键
localStorage.clear(); // 清空所有存储

localStorage.setItem('key', 'newValue');

// 存储数据（本质调用原生API）
$.localStorage = {
  set: function(key, value) {
    localStorage.setItem(key, JSON.stringify(value));
  },
  get: function(key) {
    return JSON.parse(localStorage.getItem(key));
  },
  remove: function(key) {
    localStorage.removeItem(key);
  }
};

// 使用示例
$.localStorage.set('user', { name: 'Alice' });
const user = $.localStorage.get('user');

const storage = {
  set(key, value) {
    localStorage.setItem(key, typeof value === 'string' ? value : JSON.stringify(value));
  },
  get(key) {
    const value = localStorage.getItem(key);
    try {
      return value.startsWith('{') || value.startsWith('[') ? JSON.parse(value) : value;
    } catch {
      return value;
    }
  },
  remove(key) {
    localStorage.removeItem(key);
  }
};

// 使用
storage.set('theme', 'dark');
storage.set('config', { fontSize: 14 });
const theme = storage.get('theme'); // 'dark'
const config = storage.get('config'); // { fontSize: 14 }

// 安装插件（需先引入jQuery和插件）
$.storage.set('key', value);
$.storage.get('key');