博客园公告栏增加每日一言功能

先上个效果展示：

功能：访客每次进入博客界面时，通过js自行访问api接口获得一言的json字符串通过脚本解析json数据以达到更新每日一言的目的

具体做法：

打开博客设置界面，将下方代码放到博客设置中的博客侧边公告栏的位置，之后按自己喜好调整好位置。完成这步之前请确保获取了js权限，

如无此权限需要先向博客园申请js权限

<!--实现每日一言-->
<div id="hitokoto"style="font-size:16px;color:red;">:D 获取中...</div>
<script src="https://cdn.jsdelivr.net/npm/bluebird@3/js/browser/bluebird.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/whatwg-fetch@2.0.3/fetch.min.js"></script>
<!--End-->
<script>fetch('https://v1.hitokoto.cn').then(function (res){return res.json();}).then(function (data) {var hitokoto = document.getElementById('hitokoto');hitokoto.innerText = "每日一言："+data.hitokoto; }).catch(function (err) {console.error(err);})
</script>

参数设置：

可以通过所访问的API接口的参数来进行每日一言的类型设置，共有七种类型可供选择，

七种类型及其对应参数分别为：

动画（a）、漫画（b）、游戏（c）、小说（d）、原创（e）、网络（f）、其他（g）。

请求方式如下：

https://v1.hitokoto.cn/（从7种分类中随机抽取）

https://v1.hitokoto.cn/?c=b （请求获得一个分类是漫画的句子，c代表Cat，即类型）

https://v1.hitokoto.cn/?c=f&encode=text （请求获得一个来自网络的句子，并以纯文本格式输出）

具体的一些细节和设置请点击传送门：https://hitokoto.cn/api

js代码剖析：

先通过调用API接口，获得响应后取得json数据，之后解析取得每日一言的内容，通过dom选择器获取

需要填充每日一言的标签，把内容填充进去。

到此为止：保存设置，刷新博客界面，每日一言效果实现，工作宣告完成

转载于:https://www.cnblogs.com/ubantu/p/11194235.html

博客园公告栏增加每日一言功能相关推荐

博客园计划增加的功能
1.通过日历浏览文章 2.增强的搜索功能:现在的搜索功能很简单 3.计数器:对RSS阅读进行计数 4.文章的邮件跟踪功能:http://www.cnblogs.com/cowboy/archive/2 ...
Android 博客园客户端（四）基本功能完成（博客列表和内容、新闻列表和内容、推荐博主）...
项目地址:https://github.com/ZhangTingkuo/AndroidCnblogs APK:http://files.cnblogs.com/zhangtingkuo/Androi ...
用Qt写软件系列六：博客园客户端的设计与实现（1）
引言博客园是本人每日必逛的一个IT社区.尽管博文以.net技术居多,但是相对于CSDN这种业务杂乱.体系庞大的平台,博客园的纯粹更得我青睐.之前在园子里也见过不少讲解为博客园编写客户端的博文.不过似 ...
博客园2009电子期刊改版建议
博客园2008电子期刊在2008年4月底的时候,发布了两个预览版,受到了很多博友的诚恳建议,经过多次改进后,在5月6号的正式发布了博客园电子期刊第一期也就是4月刊.我们积极改进,5月8号博客园电子期 ...
互评Alpha版本—博客园安卓APP
互评Alpha版本-博客园安卓APP 测评人:徐劭斌基于NABCD评论作品 1.根据NABCD评论作品的选题: N(Need,需求):博客园的网页版深受软件开发人员的喜爱.博客园是一个非常好的学 ...
webbrowser中localhost和发布的地址_发布一款android版博客园官方app
1.前言博客园创立于2004年1月,是一个面向开发者的知识分享社区.自创建以来,博客园一直致力并专注于为开发者打造一个纯净的技术交流社区,推动并帮助开发者通过互联网分享知识,从而让更多开发者从中受益 ...
关于给hexo博客增加每日一言（诗句，影视名句，网易云热评等）
前言:看到很多个人博客都带有每日一言功能,所以决定也弄一个,挺好看的.基于matery主题设置的,其他主题原理也一样可参考. 每日一言API 一言网(hitokoto.cn)创立于 2016 年,隶属 ...
建议博客园增加 blog 内容的 zip 打包功能。
我在"博客中国"也有一个账号,前一阵发现那里增加了将历史内容生成静态 html 网页并且自动压缩为一个 zip 文件的功能.正好我那里也不太去了,于是做了一个了结. 我想博客园是否 ...
博客园增加Live2D看板娘教程，超级简单，一看就懂
目录一.前言二.效果图三.资源准备 1.相关的资源,可以点击下面的网盘链接直接下载 2.也可以通过下面的地址到Gitbuh中下载四.实现教程 1.个人小站实现教程 2.博客园实现教程一.前言 ...

博客园公告栏增加每日一言功能

博客园公告栏增加每日一言功能相关推荐

最新文章

热门文章