在静态网站上实现浏览记录功能,浏览记录保存在用户本地。
安装
下载visit-history.min.js文件;
在你的网页中插入
<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('');