给你的博客加入一言

关于一言

动漫也好、小说也好、网络也好,不论在哪里,我们总会看到有那么一两个句子能穿透你的心。我们把这些句子汇聚起来,形成一言网络,以传递更多的感动。

这是一言网(hitokoto.cn)在简介中提及的一种服务,它可以为你的网站或博客引入一段随机语句。通过接入官网提供API可以将它带入你的站点,具体分为以下2类引入方式。

官网推荐方式

<!DOCTYPE html>
<html>
<head>
    <title>hitokoto demo1</title>
</head>
<body>
    <p id="hitokoto"><a href="#" id="hitokoto_text">:D 获取中...</a></p>
    <!-- 一言API -->
    <script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>
</body>
</html>

每次手动刷新进入,网站将随机显示一条语句。如果想获取自动刷新效果,可以使用异步加载,但首先需要引入jquery支持。

异步加载

<!DOCTYPE html>
<html>
<head>
    <title>hitokoto demo2</title>
</head>
<body>
    <a id="hitokotoa" href="#" target="_blank" rel="nofollow noopener noreferrer"><span id="hitokoto"></span></a>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <!-- 一言脚本 -->
    <script type="text/javascript">
        $(document).ready(function(){getHitokoto();});
        function hitokoto(e) {
            $("#hitokoto").stop().fadeOut(function() {
                $("#hitokoto").html(e.hitokoto);
                var element = document.getElementById('hitokotoa');
                element.href = "https://hitokoto.cn/?uuid=" + e.uuid;
                $("#hitokoto").stop().fadeIn();
            })
        };
        function getHitokoto() {
            var e = ["a", "b", "c", "d", "e", "i"];
            fetch('https://v1.hitokoto.cn/?encode=json&charset=utf-8&c=' + e[Math.floor(Math.random() * e.length)], {cache: 'no-cache', method: 'GET', mode: 'cors'}).then(response => response.json()).then(data => {
            hitokoto(data);
            setTimeout(getHitokoto, 1e4);
            }).catch(console.error)
        };
    </script>
</body>
</html>

标签: 莫得

文档最后编辑于2020年10月23日

评论

评论已关闭

:D 获取中...