两种方法简单实现网站随机语录的显示

给网站添加随机语录可以是文章后,也可以是侧栏小工具,亦或是像闲鱼的碎言碎语那样的单独页面,随机语录可以是名人名言,也可以是站长自己的言论警句。添加一个随机语录展示有时候能提升点逼格,兴许还能教化世人,维护世界和平(哈哈,越说越没边了)。闲鱼上班那会就有朋友给留言,问闲鱼的碎言碎语(http://www.macrr.com/shuo.html)那里的语录是怎么弄的,可惜上班没电脑,也折腾不好,这里把这个方法补上,这个随机语录也不是什么新鲜玩意儿了,喜欢的可以自行选用。

两种方法简单实现网站随机语录的显示

方法一:简单的JavaScript文本输出

        这个方法相对来说更简单,但是因为语录是自己添加的,数量也就更少,更单一。闲鱼目前用的就是这个,要求不高也还行。类似这类的代码也很多,这里提到的是其中之一,大同小异,就不多说了。

  1. <script language="JavaScript">  
  2. <!-- Hide  
  3. var a = Math.random() + ""          //产生一个随机数  
  4. var rand1 = a.charAt(5)             //的到这个数的第五个字符(实际还是从0~9的数字)  
  5. quotes = new Array              //创建消息数组  
  6. quotes[1] = '语录1'               //这里分配十句随机出现的文本  
  7. quotes[2] = '语录2'  
  8. quotes[3] = '语录3'  
  9. quotes[4] = '语录4'  
  10. quotes[5] = '语录5'  
  11. quotes[6] = '语录6'  
  12. quotes[7] = '语录7'  
  13. quotes[8] = '语录8'  
  14. quotes[9] = '语录9'  
  15. quotes[0] = '语录10'  
  16. var quote = quotes[rand1]   //由随机数选择一句话  
  17. //-->  
  18. </script>  
  19. <script language="JavaScript">  
  20. <!-- Hide  
  21. document.write( quote )     //将上面选择的话写进页面  
  22. // -->  
  23. </script>  

方法二:调用一言的API语录

        相对于第一个方法来说这个语录当然就更丰富了,方法也很简单。

  1. <script type="text/javascript" src="https://api.lwl12.com/hitokoto/main/get?encode=js&charset=utf-8"></script><div id="lwlhitokoto"><script>lwlhitokoto()</script></div>  
提示

以上两种方法都能实现随机语录,想要效果更好看的话,建议自己美化一下哈。

发表评论

:?::razz::sad::evil::!::smile::oops::grin::eek::shock::???::cool::lol::mad::twisted::roll::wink::idea::arrow::neutral::cry::mrgreen:

目前评论:28   其中:访客  19   博主  9

    • 明月清风 明月清风 1 来自天朝的朋友 QQ浏览器  Android 4.4.4 HUAWEI C8818 Build/HuaweiC8818 四川省雅安市 电信

      很不错的点子

      • Ink Ink 0 来自天朝的朋友 谷歌浏览器 Windows 10 江西省九江市 移动

        我的博客刚好可以用

        • 呆毛电脑配置网 呆毛电脑配置网 4 来自天朝的朋友 谷歌浏览器 Windows 10 云南省昆明市 电信

          :sad: 然并卵的功能。

            • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

              @呆毛电脑配置网 你是电你是光你是唯一的神话 :smile:

            • xiaopan xiaopan 3 来自天朝的朋友 火狐浏览器 Windows 10 中国 移动

              很有趣的功能哦,好想copy你的文章放到我博客,嘻嘻

                • 闲鱼 闲鱼 【博主】 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 日本

                  @xiaopan 文章写的很普通,转载也行,留个出处哈

                • 憧憬点滴记忆 憧憬点滴记忆 4 来自天朝的朋友 谷歌浏览器 Windows 10 四川省成都市 电信

                  可以可以,回头给自己的博客也弄一个

                    • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省长沙市 联通

                      @憧憬点滴记忆 可以有,反正又不局限加在哪里

                    • 橘子书 橘子书 4 来自天朝的朋友 谷歌浏览器 Windows 10 福建省漳州市 电信

                      一直想加,只是又怕多余,所以没下手

                        • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省长沙市 联通

                          @橘子书 个人博客嘛,每个人的喜好不同,喜欢就加,不然就叫别人博客了 :razz:

                        • 明月登楼的博客 明月登楼的博客 6 来自天朝的朋友 谷歌浏览器 Windows XP 河南省 联通

                          不错,有空在我的侧边栏试试!

                            • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省长沙市 联通

                              @明月登楼的博客 侧边栏也行,不过弄个侧边栏展示这个感觉有点累赘浪费

                            • 叶少侠 叶少侠 1 来自天朝的朋友 QQ浏览器 Windows 7 广东省佛山市 电信

                              貌似可以有~~试试!

                              • 初夏 初夏 1 来自天朝的朋友 火狐浏览器 Windows 10 广东省东莞市 电信

                                我觉得我可以试试 :mrgreen:

                                • Koolight Koolight 5 来自天朝的朋友 谷歌浏览器 Windows 7 湖南省株洲市 电信

                                  记得以前玩DotA的时候命令-random可以随机英雄。

                                    • 闲鱼 闲鱼 【博主】 来自天朝的朋友 Safari浏览器 iPad OS 10_2 like Mac OS X) AppleWebKit 湖南省长沙市 联通

                                      @Koolight 用的方法一感觉已经灰常简单了,效果也不错

                                    • 明月登楼 明月登楼 6 来自天朝的朋友 谷歌浏览器 Windows 10 河南省南阳市 电信

                                      呵呵,不错,这个有空可以弄个试试!

                                      • 九哥 九哥 4 来自天朝的朋友 QQ浏览器 Windows 7 辽宁省盘锦市 联通

                                        就用方法一,简单实用。

                                        • 厨房排油烟 厨房排油烟 0 来自天朝的朋友 谷歌浏览器 Windows XP 上海市徐汇区 电信

                                          喜欢写非常好!

                                          • 消防排风系统 消防排风系统 2 来自天朝的朋友 谷歌浏览器 Windows 10 上海市徐汇区 电信

                                            不错不错真不错,先收藏着……

                                            • Flyer Flyer 2 这家伙可能用了美佬的代理 Safari浏览器 Mac OS X 10_10_5 美国 华盛顿哥伦比亚特区Cogent通信公司

                                              不错不错

                                              • 快乐网讯 快乐网讯 0 来自天朝的朋友 谷歌浏览器 Windows 7 广东省佛山市 电信

                                                文章不错非常喜欢呀

                                                • 流年哔哔 流年哔哔 3 来自天朝的朋友 火狐浏览器 Windows 10 湖北省襄阳市 联通

                                                  我发现一个问题,填完资料之后,点击一下QQ栏,然后上面的资料就会被清空。。。。 方法一 适合自己添加一些自己的经典语录。还是比较好的。。

                                                    • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                      @流年哔哔 你都填好信息了,点击QQ栏干什么,清空了才能填写输入QQ后获取的信息啊

                                                    • 无人小站 无人小站 2 未知系统 谷歌浏览器 Windows 10 运营商级NAT(宽带运营商局域网)

                                                      自己做个api调用美滋滋

                                                        • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                          @无人小站 喜欢折腾的,做个自己的也是没问题,不过闲鱼觉得这个属于小功能,图简单就行了

                                                        • 懿古今 懿古今 4 来自天朝的朋友 谷歌浏览器 Windows 7 广西南宁市 电信

                                                          使用API的感觉比较强大,内容比较多,方法一人工添加的,数量上很难做到很多

                                                            • 闲鱼 闲鱼 【博主】 来自天朝的朋友 QQ浏览器 Windows 7 湖南省常德市 电信

                                                              @懿古今 数量上是不能比,不过正因为API提供的多而杂,觉得不好的语录也不能选择,而方法一可以加入独属于自己的语录