【随机一句诗歌】【JS】随机一句诗歌，并且附带点击时间和当前时间。

来源地址：https://juejin.cn/post/7033014658181103653

【每日一点事】

在埃菲尔铁塔上，其实，共刻有72位科学家的名字…

一、代码

【核心代码】

getTodayNowTime() 当前时间计算

        // 当前时间计算转换function getTodayNowTime() {var date = new Date();// 分别获取当前年、月、日、时、分、秒var year = date.getFullYear();var month = date.getMonth() + 1;var day = date.getDate();var hour = date.getHours();var minute = date.getMinutes();var second = date.getSeconds();var week = ["日", "一", "二", "三", "四", "五", "六"] // 一周的数组（替换为中文周期）if (hour < 10) {hour = "0" + hour;}if (second < 10) {second = "0" + second}if (minute < 10) {minute = "0" + minute}var today = year + "年" + month + "月" + day + "日 ";var nowTime = hour + "时" + minute + "分" + second + "秒";return today + nowTime + " 星期" + week[date.getDay()];}

getPoem()随机一句诗歌

        // 获取随机一句诗歌function getPoem() {jinrishici.load(function (result) {sentence.innerHTML = result.data.content;console.log(result)info.innerHTML = '来源：<span style="font-size: 14px;color: #999;">《' +result.data.origin.title + '》' +'【' + result.data.origin.dynasty + '】' + result.data.origin.author +"</span>";poem_lasttime.innerHTML = '上一次点击时间：' + getTodayNowTime();});}

clock()定时刷新当前时间

        // 定时刷新当前时间：self.setInterval("clock()", 1000); //第一个参数为函数方法  第二个为1秒function clock() {document.getElementById("clock").innerHTML = "当前时间：" + getTodayNowTime();}

【完整代码】

随机一句诗歌.html

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>随机一句诗歌 南方者 - 掘金</title>
</head>
<script src="http://code.jquery.com/jquery-latest.js">
</script><body style="height: 100%;width: 100%;background-color: pink;"><!-- 获取随机一句诗歌所需 --><script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script><center style="margin-top: 100px;"><div style="width: 500px;"><h2>随机一句诗歌<span><button onclick="getPoem()">换一句</button><p style="font-size: 14px;" id="poem_lasttime"></p></span></h2><div id="poem_sentence"></div><div id="poem_info" style="float: right;"></div></div></center><div id="clock" style="position: fixed; bottom: 500px;width: 100%;text-align: center;"></div><script type="text/javascript">console.log("***************************************");console.log("*********测试Demo 南方者 - 掘金*********");console.log("https://juejin.cn/user/2840793779295133");console.log("***************************************");getPoem(); // 初始化随机第一句诗歌var poem_lasttime = document.querySelector("#poem_lasttime"); // 记录上一次点击的时间var sentence = document.querySelector("#poem_sentence"); // 诗歌内容var info = document.querySelector("#poem_info"); // 诗歌作者相关信息// 获取随机一句诗歌function getPoem() {jinrishici.load(function (result) {sentence.innerHTML = result.data.content;console.log(result)info.innerHTML = '来源：<span style="font-size: 14px;color: #999;">《' +result.data.origin.title + '》' +'【' + result.data.origin.dynasty + '】' + result.data.origin.author +"</span>";poem_lasttime.innerHTML = '上一次点击时间：' + getTodayNowTime();});}// 定时刷新当前时间：self.setInterval("clock()", 1000); //第一个参数为函数方法  第二个为1秒function clock() {document.getElementById("clock").innerHTML = "当前时间：" + getTodayNowTime();}// 当前时间计算转换function getTodayNowTime() {var date = new Date();// 分别获取当前年、月、日、时、分、秒var year = date.getFullYear();var month = date.getMonth() + 1;var day = date.getDate();var hour = date.getHours();var minute = date.getMinutes();var second = date.getSeconds();var week = ["日", "一", "二", "三", "四", "五", "六"] // 一周的数组（替换为中文周期）if (hour < 10) {hour = "0" + hour;}if (second < 10) {second = "0" + second}if (minute < 10) {minute = "0" + minute}var today = year + "年" + month + "月" + day + "日 ";var nowTime = hour + "时" + minute + "分" + second + "秒";return today + nowTime + " 星期" + week[date.getDay()];}</script>
</body></html>

二、展示与体验

1 首次页面

2 点击换一句

3 体验地址

随机一句诗歌.html

【最后】

感谢你看到最后，如果你持有不同的看法，欢迎你在文章下方进行留言、评论。

我是南方者，一个热爱计算机更热爱祖国的南方人。

　　如果文章内容仅供学习参考，如有侵权，非常抱歉，请立即联系作者删除。

【随机一句诗歌】【JS】随机一句诗歌，并且附带点击时间和当前时间。相关推荐

js 随机1-10随机数_寻找随机的错误-一个真实的故事
js 随机1-10随机数几周前,我完成了RapidFTR开源项目的错误查找 ,这花了我三个晚上. 我认为可能值得分享狩猎的故事. 本文将介绍我的工作. 我将概述我的旅程,以便真正找到正在发生的事情的 ...
js随机飘动的广告图片代码demo效果示例（整理）
<!DOCTYPE html> <html><head><meta http-equiv="Content-Type" content=& ...
js随机生成16进制颜色值
js随机生成16进制颜色值背景很多情况下,我们会遇到给某个dom设置随机颜色,这里采用js函数直接生成,并返回随机16进制颜色值. function getRandomColor{var str= ...
JS—随机三个0-9不重复的随机数
JS-随机三个0-9不重复的随机数 while(this.arr.length < 3){let num = parseInt(Math.random() * 9)// parseInt取正,小 ...
js随机生成彩票号码双色球
js随机生成彩票号码双色球 <!DOCTYPE html> <html lang="en"><head><meta charset=&q ...
原生JS随机抽取号码
原生JS随机抽取号码,支持一次抽取多个号码.可限定范围抽取.自动去重 <div class="pick-range"><span>号码抽取范围:</s ...
风尚云网前端-js随机生成自定义位随机字符
风尚云网前端-js随机生成自定义位随机字符废话不多说: 上代码 // 随机生成随机数randomPassword(size) {var seed = new Array("A" ...
python扇贝每日一句api_扇贝-每日一句
[原文链接]:https://blog.tecchen.xyz ,博文同步发布到博客园. 由于精力有限,对文章的更新可能不能及时同步,请点击上面的原文链接访问最新内容. 欢迎访问我的个人网站:http ...
长难句结构分析最新经典一百句
<script type="text/javascript">function StorePage(){d=document;t=d.selection?(d.sele ...

【随机一句诗歌】【JS】随机一句诗歌，并且附带点击时间和当前时间。

【每日一点事】

一、代码

【核心代码】

【完整代码】

二、展示与体验

【最后】

【随机一句诗歌】【JS】随机一句诗歌，并且附带点击时间和当前时间。相关推荐

最新文章

热门文章