惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

T
Troy Hunt's Blog
P
Proofpoint News Feed
Help Net Security
Help Net Security
T
The Exploit Database - CXSecurity.com
Recent Commits to openclaw:main
Recent Commits to openclaw:main
NISL@THU
NISL@THU
Forbes - Security
Forbes - Security
N
News and Events Feed by Topic
C
CERT Recently Published Vulnerability Notes
Simon Willison's Weblog
Simon Willison's Weblog
Hacker News: Ask HN
Hacker News: Ask HN
P
Privacy International News Feed
www.infosecurity-magazine.com
www.infosecurity-magazine.com
Hacker News - Newest:
Hacker News - Newest: "LLM"
云风的 BLOG
云风的 BLOG
博客园 - 【当耐特】
S
Secure Thoughts
爱范儿
爱范儿
Jina AI
Jina AI
H
Heimdal Security Blog
量子位
罗磊的独立博客
人人都是产品经理
人人都是产品经理
T
Threat Research - Cisco Blogs
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Cisco Talos Blog
Cisco Talos Blog
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
MyScale Blog
MyScale Blog
T
Tor Project blog
博客园_首页
T
Tenable Blog
H
Hackread – Cybersecurity News, Data Breaches, AI and More
T
Threatpost
The GitHub Blog
The GitHub Blog
P
Proofpoint News Feed
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
Security Archives - TechRepublic
Security Archives - TechRepublic
TaoSecurity Blog
TaoSecurity Blog
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
Latest news
Latest news
AWS News Blog
AWS News Blog
Y
Y Combinator Blog
Martin Fowler
Martin Fowler
Last Week in AI
Last Week in AI
V
Visual Studio Blog
The Hacker News
The Hacker News
I
Intezer
L
LINUX DO - 最新话题
L
LangChain Blog
W
WeLiveSecurity

HCLonely Blog

HCLonely Blog - 让OpenWrt控制台进入赛博空间:luci-theme-cyberpunk HCLonely Blog - Artitalk V4: 从Leancloud迁移至Vercel HCLonely Blog - 记一次hexo-bilibili-bangumi分时函数渲染优化 HCLonely Blog - IP签名图片生成服务 HCLonely Blog - 树莓派搭建私有在线PS网站 HCLonely Blog - 将 Node.js 项目打包为一个可执行文件 HCLonely Blog - 哔哩哔哩硬核会员搜题脚本 HCLonely Blog - 统一推送服务Nodejs API HCLonely Blog - 在线答题搜答案脚本 HCLonely Blog - 青年大学习安卓跳过方法 HCLonely Blog - 公主连结 Re:Dive 中文输入法词库 HCLonely Blog - 基于 NodeJs 的 live2d 后端 Api 服务器 HCLonely Blog - 百度分析和谷歌分析适配 pjax HCLonely Blog - hexo-calendar 活动日历插件 HCLonely Blog - Git 免密、免 SSH 进行 push & pull HCLonely Blog - 一款基于 webstack 的 hexo 主题 HCLonely Blog - 使用 cron-job 解决 LeanCloud 因流控原因自动唤醒失败的问题 HCLonely Blog - Valine 添加验证码、博主标签及评论微信、QQ 通知 HCLonely Blog - 使用 Cloud Studio 在线搭建、编辑、部署 Hexo HCLonely Blog - 给你的网页添加一个 moc3 格式的 Live2d 模型 HCLonely Blog - Hexo-tag-steamgame 插件 HCLonely Blog - Hexo-online-server 在线编辑发布文章插件 HCLonely Blog - Hexo 博客美化
HCLonely Blog - 在静态网站上实现浏览记录功能
博主:HCLonely · 2023-02-03 · via HCLonely Blog

在静态网站上实现浏览记录功能

文章二维码

扫一扫手机观看

  • 发布时间:
  •  次浏览
  • 339 字数
  • 分类:JavaScript
  1. 首页
  2. 正文  
  3. 分享到:

本文最后更新于天前,内容可能已不再适用!

在静态网站上实现浏览记录功能,浏览记录保存在用户本地

安装

  1. 下载visit-history.min.js文件;

  2. 在你的网页中插入

    <script src="path/to/visit-history.min.js"></script>
    

或直接使用CND

<script src="https://cdn.jsdelivr.net/gh/HCLonely/visit-history@1visit-history.min.js"></script>

使用

保存浏览记录

const { visitHistory } = require('visit-history');

visitHistory.set({
  data: { }, // [必需]保存的数据
  identifier: () => window.location.pathname, // [可选]网页的位移标识符, 默认为 () => window.location.pathname
  limit: 20 // [可选]最大保存的浏览历史数量,默认为 20
});

Example:

const { visitHistory } = require('visit-history');

visitHistory.set({
  data: {
    title: document.querySelector('title').innerText.trim(),
    link: window.location.href
  },
  identifier: () => window.location.href,
  limit: 30
});

读取浏览记录

const { visitHistory } = require('visit-history');

visitHistory.get({
  htmlTemplate: '', // [可选]Html模板, 使用'{{key}}'替换data中的变量. 留空则返回保存的data数据, 默认为空
  limit: 10 // [可选]读取的浏览记录数量, 留空则返回所有数据, 默认为空
});

Example:

const { visitHistory } = require('visit-history');

const history = visitHistory.get({
  htmlTemplate: '<div class="title><a href="{{link}}">{{title}}</a></div>',
  limit: 10
});
document.querySelector('.history').innerHTML = history.join('');

鸣谢

赞赏作者

扫一扫支付