早上起来的时候看到微信群中有博友分享自己的建站时间,聊着聊着说到总字数上面,这时我才发现我的网站没有统计的地方,索性就自己写一个吧,因为是静态博客,所以不涉及后端、服务器等,只用前端的方式来解决。
这里需要借助我之前的一篇文章,《用原生js给网站写个搜索功能》,里面有提到如何生成一个文章列表json文件,这里我们会用到这个文件 index.json
。
写一个ajax方法,让浏览器遍历每个页面。
代码语言:javascript
复制
$(document).ready(function () { $.ajax({ url: '/index.json', type: 'get', dataType: 'json', success: function (data) { const pageUrls = data; const totalNum = pageUrls.length; $('#totalNum').html(totalNum); let totalWords = 0; pageUrls.forEach(urlObj => { $.get(urlObj.permalink, function(data) { const content = data.replace(/(<([^>]+)>)/gi, " ").replace(/[^\w\s]/gi, " "); const words = content.split(" "); const wordCount = words.filter(word => word !== "").length; totalWords += wordCount; $('#totalWords').html(totalWords); }); }); }, error: function () { console.log('error') } })
});
我是将信息放在我的 关于 页面下。
代码语言:javascript
复制
经过脚本统计,我已经写了 <span id="totalNum"></span> 篇文章,总共 <span id="totalWords"></span> 个字。
<!-- 经过脚本统计,我已经写了 164 篇文章,总共 97577 个字。 -->