2020 水文第二篇,为任意站点添加英文每日一句,随机从金山词霸、有道词典、欧路词典、海词词典和扇贝英语获取内容。你可在博客首页查看效果,大佬请跳过。
引入 JS
将以下代码加入到 <head>
标签中。对于本主题,依次进入 控制台 - 外观 - 设置外观 - 主题自定义扩展
,将代码加入到 自定义 HTML 元素拓展 - 标签: head 头部 (meta 元素后)
,也可直接加入到主题对应的 header.php
中的 </head>
标签前。
<script>
// 获取每日一句并显示
document.addEventListener('DOMContentLoaded', initDescription);
function initDescription() {
// 锚点开始
if (location.href !== location.origin + '/') return;
const h1 = document.querySelector('h1.blog-title');
const h2 = document.querySelector('h2.blog-description');
// 锚点结束
const local = {
set: (key, value) => localStorage.setItem(key, JSON.stringify(value)),
get: key => {
const value = JSON.parse(localStorage.getItem(key));
if (value && new Date(value.date).toDateString() !== new Date().toDateString()) return null;
return value;
}
};
const render = (data, save) => {
h1.innerHTML = data.sentence, h2.innerHTML = data.translation;
if (save) local.set('sentence', data);
};
const data = local.get('sentence');
if (data) { render(data); return; }
fetch('//logi.im/api/sentence/').then(response => response.json()).then(json => render(json, true));
}
</script>
如果你开启了 PJAX
,可能需要单独加入回调函数。对于本主题,依次进入 控制台 - 外观 - 设置外观 - PJAX(BETA) - PJAX RELOAD
,将 initDescription();
添加进入即可。
其他主题
其他主题需要通过 F12 找到对应锚点,替换代码中那三行,不知道怎么找的,留下 博客链接
和 要加入的位置
,我看到后会将锚点代码更新到此。
CREAMY
演示地址
if (location.href !== location.origin + '/index.php') return;
const h1 = document.querySelector('h1.site-name');
const h2 = document.querySelector('h2.site-description');
如果你想自行部署 API,回复后刷新页面即可获取 PHP 源码。
此处内容需要评论回复后方可阅读
如有问题请在下方留言,文章转载请注明出处,详细交流请加下方群组!请大佬不要屏蔽文中广告,因为它将帮我分担服务器开支,如果能帮忙点击我将万分感谢。
看看写的啥
看看写的啥
我试试欧陆词典的
日常膜拜大佬
啊这
感谢 学习
Thanks for share...@(呵呵)
日常学习,#(献花)
过来看看大佬
感谢分享!感谢分享!
感谢大佬分享wwww
感谢 需要
感谢分享!
不错的教程
好棒的教程@(太开心)
嗯,不错不错
辛苦啦@(呵呵)
我试试#(高兴)
谢谢,我来试试
看起来不错@(呵呵)
感谢支持
辛苦了。。