html智能网页工作便签(简单、轻便、快捷)

更新时间: 2025-12-03      阅读 收藏
立即下载

html智能网页工作便签(简单、轻便、快捷)(图1) html智能网页工作便签(简单、轻便、快捷)(图2) html智能网页工作便签(简单、轻便、快捷)(图3)
功能说明
便笺显示:默认设置便签按创建日期倒序显示(最新的便签在最前面)
主题选择:支持消息通知(toast通知)
红色主题 - 激情、活力,适合需要强调重要事项的场景
青色主题 - 清新、科技感,适合程序员和技术工作者
琥珀色主题 - 温暖、明亮,适合创意工作者
靛蓝色主题 - 专业、深邃,适合商务用途
玫瑰色主题 - 温柔、浪漫,适合个人笔记
青绿色主题 - 时尚、潮流,年轻化设计
导入数据:粘贴json数据
导出数据:json数据格式
完成操作:作为工作任务时,可进行完成操作,或一键所有任务完成。

关键代码

  1.         // 加载保存的主题
  2.         function loadTheme() {
  3.             const savedTheme = localStorage.getItem(THEME_KEY);
  4.             if (savedTheme) {
  5.                 currentTheme = savedTheme;
  6.                 document.body.className = savedTheme;
  7.                 document.getElementById('theme-select').value = savedTheme;
  8.             }
  9.         }
  10.  
  11.         // 切换主题
  12.         function switchTheme(theme) {
  13.             document.body.className = theme;
  14.             currentTheme = theme;
  15.             localStorage.setItem(THEME_KEY, theme);
  16.             document.getElementById('theme-select').value = theme;
  17.             showToast('主题已切换!');
  18.         }
  19.                 ...
  20.         // 从本地存储获取便签数据
  21.         function getNotesFromStorage() {
  22.             const notesJSON = localStorage.getItem(STORAGE_KEY);
  23.             const notes = notesJSON ? JSON.parse(notesJSON) : [];
  24.  
  25.             // 确保每个便签都有completed属性
  26.             return notes.map(note => ({
  27.                 ...note,
  28.                 completed: note.completed || false
  29.             }));
  30.         }
  31.  
  32.         // 保存便签到本地存储
  33.         function saveNotesToStorage(notes) {
  34.             localStorage.setItem(STORAGE_KEY, JSON.stringify(notes));
  35.         }
  36.                 ...
复制代码


- THE END -
取消
微信二维码
微信二维码
支付宝二维码
最新推荐
推荐标签