超简单 js 调用一言

看到有些博客主在自己网站空缺地方增加了一言栏目,刷新一次页面就会换一条句子,搜索了一番,还真有热心哥们儿提供 api,api 的搭建其实也很简单,这里暂时就不多说了,我们为了方便直接用 js 代码调用别人的 api。

超简单 js 调用一言
一言调用演示

感兴趣可以在本站底部搜索框下看到调用的一言句子

创建 HTML

首先我们在需要显示一言的地方创建一个空 html,代码如下:

<div class='hitokoto'></div>

js 代码

此 js 代码基于 jq 插件,如果有了请无视,如果你的网站没有使用 jq 请先引用:

<script type='text/javascript' src='//umrhe.com/wp-content/themes/ripro/assets/js/jquery-2.2.4.min.js'></script>

在你的 footer.php 文件最后写入以下代码:

<script type='text/javascript'>
$.get("https://v1.hitokoto.cn/",function(data,status){
	if (status == 'success'){
		$('.hitokoto').text(data.hitokoto);
	}else{
		$('.hitokoto').text('获取出错!');
	}
});
</script>

点此查看演示效果

转载请注明出处。
何先生 » 超简单 js 调用一言
Loading...

发表评论

表情
图片 链接 代码

提供最优质的资源集合

立即查看 了解详情