430 字
2 分钟
在网页中嵌入随机名言
什么是一言?
以下是 一言开发者文档 中的介绍:
动漫也好、小说也好、网络也好,不论在哪里,我们总会看到有那么一两个句子能穿透你的心。我们把这些句子汇聚起来,形成一言网络,以传递更多的感动。如果可以,我们希望我们没有停止服务的那一天。
简单来说,一言指的就是一句话,可以是动漫中的台词,也可以是网络上的各种小段子。 或是感动,或是开心,有或是单纯的回忆。来到这里,留下你所喜欢的那一句句话,与大家分享,这就是一言存在的目的。
打开 一言 的官网,映入眼帘的便是每次都会刷新的一句话,也可以通过它提供的接口,将这句话嵌入到我们自己的网页中。
接口的调用
官方文档 给出了这样的调用方法:
<p id="hitokoto">
<a href="#" id="hitokoto_text">:D 获取中...</a>
</p>
<script>
fetch('https://v1.hitokoto.cn')
.then(response => response.json())
.then(data => {
const hitokoto = document.querySelector('#hitokoto_text')
hitokoto.href = `https://hitokoto.cn/?uuid=${data.uuid}`
hitokoto.innerText = data.hitokoto
})
.catch(console.error)
</script>
这样的调用方式采用了 <a>
标签,链接指向了一言源网页。但这种调用方式会在文字下方生成下划线。下面给出一种采用段落 <p>
标签的示例:
<p id="hitokoto_text">:D 获取中...</p>
<p id="hitokoto_from">from</p>
<script>
fetch('https://v1.hitokoto.cn')
.then(response => response.json())
.then(data => {
hitokoto_text.innerText = data.hitokoto
hitokoto_from.innerText = data.from
})
.catch(console.error)
</script>
此代码中, .hitokoto
即为获取到的一句话内容, .from
即为来源。对于其中的参数、返回的内容都可以参考 官方文档 进行设定。请注意,请在合适的地方添加对于 一言 的引用。