美文网首页
静态博客如何实现站内搜索-大象装入冰箱

静态博客如何实现站内搜索-大象装入冰箱

作者: 余很多之很多code | 来源:发表于2022-11-08 11:38 被阅读0次

静态博客如何实现站内搜索

静态博客

我们通过markdown写文章,
再通过hexo,Jekyll等开源框架,可以生成自己的纯静态博客网站。
通过我们的云服务器,或者github和gitee也支持我们把生成的纯静态页面发布出去,直接能够互联网访问。

但是静态博客如何实现站内搜素呢:

  1. 简单的方式是利用搜索引擎或者第三方提供的站内搜索服务,这里不做这方面的讨论。
  2. 通过js实现搜索,这个我们做详细的展开介绍下】。

js如何实现搜索

其实原理很简单,就像把大象装入冰箱的步骤一样。

把冰箱门打开

维护好配置信息。
比如我们有三篇文章

java入门, 内容:java入门文章
go入门, 内容:go入门文章
python入门, 内容:python入门文章

对文章标题和url进行摘记:

{
    "1": "java入门-url",
    "2": "go入门-url",
    "3": "python入门-url"
}

把文章标题和url用数字关联。

对文章内容进行摘记:

{
    "java":"1-1",
    "go":"2-1",
    "python":"3-1",
    "入门":"1-1,2-1,3-1",
    "文章":"1-1,2-1,3-1",
}

以上内容举例就明白了:
比如"入门":"1-1,2-1,3-1"表示就是”入门“这关键字在出现在文章1的第一行,还出现在文章2的第一行,还出现在文章3的第一行。

其实就是反向索引的一些思路,只不过我们没对内容进行压缩和优化保存,改用对js友好的js格式保存,毕竟个人的笔记量即使每天写,每分钟写。。。

以上摘记内容我们完全可以用自己擅长的语言对内容进行分析产生这样的json内容,并直接当全局变量保存到js中。

把大象放进去

js操作配置信息。
这时候就更简单了,我们获取用户输入的搜索关键字,去json里面匹配。
比如我们输入java,则获取到"1-1",
我们就知道是文章1的第一行出现java这个关键字,
而文章1对应的就是“java入门这篇文章”。

然后把门关上

大象装入冰箱是要三步的,我们也是哈,第三部发布出去。

相关文章

  • 静态博客如何实现站内搜索-大象装入冰箱

    静态博客如何实现站内搜索 静态博客 我们通过markdown写文章,再通过hexo,Jekyll等开源框架,可以生...

  • 把大象装入冰箱

    怎样把大象装进冰箱?我们可以考虑先把大象的哪个部位塞进冰箱里,好像暂时想不到该把那一个地方先塞进冰箱里,那就先上手...

  • 文件操作

    文件操作:打开文件、读写文件、操作文件内容 写入文件操作:(把大象装入冰箱)1.打开文件 ...

  • 如何再把河马装进冰箱?

    某一特制冰箱大小能装下一头大象或河马,如何把一头大象装进冰箱?如何再把河马装进冰箱? 1.把冰箱门打开;2.把大象...

  • 怎样拆解运营目标?就如把大象放冰箱一样有趣

    从思考如何把大象放进冰箱,继而思考如何对运营目标进行拆解。 一、把大象放进冰箱需要几步?你会拆解吗? 有些很专业又...

  • Hexo静态博客添加站内搜索--Swiftype

    原文链接:http://drunkevil.com/2015/04/08/swiftype-search-engi...

  • 面向对象

    面向对象 面向对象思想有三大要素:封装、继承和多态。 如何大象装进冰箱?面向过程:为了把大象装进冰箱,需要3个过程...

  • 模版模式

    类图 模版模式.png 实现 调用 输出 把某东西装进冰箱的类 把大象装冰箱 把苹果装冰箱 The Templat...

  • 慕课网tab封装插件的碎碎念

    首先我们看一下最经典的“把大象放冰箱”这个问题 面向过程的解决方法 在面向过程的编程方式中实现“把大象放冰箱”这个...

  • HEXO 趟坑笔记

    我的blog 如何使用Hexo在github上搭建静态博客 如何使用Hexo在github上搭建静态博客 感冒两天...

网友评论

      本文标题:静态博客如何实现站内搜索-大象装入冰箱

      本文链接:https://www.haomeiwen.com/subject/urcntdtx.html