网站最后更新日期:2018年8月29日
欢迎大家来到畅想资源 AREFLY.COM! 个人网站 更多联络方式
×

为网站之“开发人员工具”内添加彩蛋教学

大家有可能发现于许多其他的大站点内在浏览器的“开发人员工具”可以看到许多例如招聘信息等彩蛋,而今天畅想资源就来教大家如何在你的网站中也添加一个类似的彩蛋等著访客去挖掘吧!

预览

add-easter-eggs-to-developer-tools-demo

教学

1、首先将下方代码添加到网页底部的的最底部 </body> 前或主题所引用之JS文件内(例如“functions.js”等)即可! :razz:

提示:对于WordPress站点来说即须添加于主题的“footer.php”文件内!另外如果加入于HTML中要记得带上 <script> 标签哦~

注释:console.log 后的 %c 是代表使用下一个参数内所写之CSS(例如 color: orange; 等)!

2、当然你也可以加入标示为“警告”或“错误”类型的彩蛋,不过畅想资源并不推荐大家这么做~ :laugh:

add-easter-eggs-to-developer-tools-1

3、现在你就可以在你网站的“开发人员工具”中找到你所加入的彩蛋啦! :razz:

add-easter-eggs-to-developer-tools-demo

参考

在“开发者工具”中加入彩蛋

历史上的今天

2013年:给WordPress添加电子邮件登陆的功能(42条评论)

觉得这篇文章有用吗?分享一下让更多人受益吧!

© 版权声明:本文章采用“姓名标示-非商业性-相同方式分享 4.0 国际(CC BY-NC-SA 4.0)”于“”发布,转载时须以相同方式发布并注明“原文链接”!

本文固定链接:https://www.arefly.com/zh-cn/add-easter-eggs-to-developer-tools/

本文章由“超级efly”于2014年08月16日发表于“网络”分类

你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站

转载请注明:为网站之“开发人员工具”内添加彩蛋教学 | 畅想资源

关键字:, ,

为网站之“开发人员工具”内添加彩蛋教学:目前有 48 条留言
访客以 25:23 暂时领先博主

评论载入中,请稍等……
  1. 22楼
    BigCat China Google Chrome Windows

    不错啊

    [回复]
  2. 21楼
    iKirby China Google Chrome  W17Pro(Dualcore) Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.76 Safari/537.36

    这个有意思。顺便看到了ABP,推荐下μBlock,兼容ABP规则,而且比它占用资源少得多。在我的电脑上比ABP占用内存少100多MB。

    [回复]
    • 好的~感谢推荐~下次去试试! :razz:

      [回复]
  3. 20楼
    路易大叔 China Mozilla Firefox Windows

    我还是不赶潮流了

    [回复]
  4. 19楼
    www.39123.cn China Mozilla Firefox Windows

    什么彩蛋

    [回复]
  5. 18楼
    恋羽 China Google Chrome Windows

    这里的玩法很多的,我自己就加了一个调试信息输出的。

    [回复]
  6. 17楼
    松果 China Google Chrome Windows

    飘过 :cool:

    [回复]
  7. 16楼
    xnces China Google Chrome Windows

    不错,先 Mark 一个,回头试试!

    [回复]
  8. 15楼
    惜乐博客 China Google Chrome Windows

    再次路过 表示我是好人

    [回复]
  9. 14楼
    南国羽 China Google Chrome Windows

    支持一下。以前见过某在线电视网站用过类似方法,不过那货直接把右键菜单和开发者工具封了,换了几个浏览器都没法启动。

    [回复]
    • 这些封右键/开发者工具的人烦死了 :crazy:

      [回复]
  10. 13楼
    刘印 China Google Chrome Windows

    查看本站源码当心电脑爆炸!

    [回复]
  11. 12楼
    健康减肥博客 China 搜狗浏览器 Windows

    挺不错的,支持一下,以后会经常关注该博客,同时欢迎回访!

    [回复]
  12. 好像百度使用过这招吧,哈哈 :mrgreen:

    [回复]
  13. 10楼
    Rich China 搜狗浏览器 Windows

    欢迎访问“畅想资源”! functions.js:1
    本站由“超级efly”制作 functions.js:2
    (C) 超级efly版权所有 functions.js:3
    并且使用博客程式 WordPress 及主题 Weisay Simple functions.js:4
    向本站捐款:https://www.arefly.com/donate/ functions.js:5
    多谢您的访问与支持! functions.js:6

    :grin:

    [回复]
    • :grin: :grin: 向本站捐款:https://www.arefly.com/donate/! :trick: :trick:

      [回复]
  14. 9楼
    分享好东西 China Google Chrome Windows

    。。

    浏览器装了好多插件啊沃茨。。

    [回复]
  15. 8楼
    php程序员 China Google Chrome Windows

    没看到呢,难道是被禁止了么。

    [回复]
    • 需要点击“开发人员工具”右上角的那个符号或者切换至“Console”才可以看到~~ :mrgreen:

      [回复]
  16. 7楼
    松果 China Google Chrome Windows

    签到 :grin:

    [回复]
    • 今天签到啦!时间:下午2:51:22(使用Arefly评论框自动签到)

      [回复]
      • 松果 China Google Chrome Windows

        自带回复?

        [回复]
        • 对呀~今天签到啦!时间:下午3:11:11(使用Arefly评论框自动签到)

          [回复]
  17. 6楼
    很黑很非洲 China Netscape Navigator iPhone

    你也是用的wptouch吗?

    [回复]
  18. 5楼
    上邪 China Google Chrome Windows

    我网页的源码也有彩蛋

    [回复]
  19. 4楼
    惜乐博客 China Google Chrome Windows

    路过支持下

    [回复]
  20. 地板
    Junhunz China Google Chrome Windows

    作死啊@@@@@

    [回复]
  21. 板凳
    快乐家园 China Google Chrome Windows

    加个图片也不错

    [回复]
  22. 沙发
    吴尼玛 China Google Chrome Windows

    矮油,不好了,你忘加我版权了

    [回复]

发表评论 点击这里取消回复。



微笑 调皮 偷笑 可爱 大笑 坏笑 诡计 赞 疑问 HI~ 爱 抱歉 对不起 头晕 惊讶 帅 努力 劳累 疯狂 难过 大哭 差 猪 邪恶 无言 愤怒 流汗 擦汗


快捷键:Ctrl+Enter