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

Aug162014

作者：超级efly 发布：2014-08-16 13:45 分类：网络阅读：995 48条评论

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

预览

教学

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

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

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

console.log('%c欢迎访问“畅想资源”！', 'color: orange;');
console.log('%c本站由“超级efly”制作', 'color: purple;');
console.log('%c(C) 超级efly版权所有', 'color: brown; font-weight: bold;');
console.log('%c并且使用博客程式 WordPress 及主题 Weisay Simple', 'color: green;');
console.log('%c多谢您的访问与支持！', 'color: blue;');

console.log('%c欢迎访问“畅想资源”！', 'color: orange;');

console.log('%c本站由“超级efly”制作', 'color: purple;');

console.log('%c并且使用博客程式 WordPress 及主题 Weisay Simple', 'color: green;');

console.log('%c多谢您的访问与支持！', 'color: blue;');

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

console.warn('%c本段将会输出警告标示！', 'color: orange;');
console.error('%c本段将会输出错误标示！', 'color: red;');

1 2	console.warn('%c本段将会输出警告标示！', 'color: orange;'); console.error('%c本段将会输出错误标示！', 'color: red;');

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

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

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

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

关键字：JS, 彩蛋, 开发人员工具

[上一篇] 于拷贝网页内容时自动添加版权链接教学

[下一篇] 修改WordPress默认jQuery至第三方jQuery Lib库教学

您可能还会对这些文章感兴趣！

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

评论载入中，请稍等……

22楼
BigCat ：

不错啊

2014-08-21 上午8:35 [回复]
21楼
iKirby ：

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

2014-08-19 下午12:46 [回复]
- 超级efly ：
  
  好的～感谢推荐～下次去试试！
  
  2014-08-19 下午11:01 [回复]
20楼
路易大叔 ：

我还是不赶潮流了

2014-08-18 下午10:51 [回复]
- 超级efly ：
  
  2014-08-19 下午11:00 [回复]
19楼
www.39123.cn ：

什么彩蛋

2014-08-18 上午10:42 [回复]
- 超级efly ：
  
  一个很无聊的彩蛋
  
  2014-08-19 下午10:58 [回复]
18楼
恋羽 ：

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

2014-08-17 下午4:48 [回复]
- 超级efly ：
  
  是啊～
  
  2014-08-19 下午10:57 [回复]
17楼
松果 ：

飘过

2014-08-17 下午3:24 [回复]
- 超级efly ：
  
  飘过～
  
  2014-08-19 下午10:57 [回复]
  - 松果 ：
    
    快帮我看看我现在的模板和以前那个那个好看
    
    2014-08-20 上午8:20 [回复]
    - 超级efly ：
      
      挺不错的主题！支持一下！！
      
      2014-08-20 下午10:34 [回复]
16楼
xnces ：

不错，先 Mark 一个，回头试试！

2014-08-17 下午2:11 [回复]
- 超级efly ：
  
  多多尝试哈～
  
  2014-08-19 下午10:56 [回复]
15楼
惜乐博客 ：

再次路过表示我是好人

2014-08-17 上午9:28 [回复]
- 超级efly ：
  
  多多厉害～
  
  2014-08-19 下午10:54 [回复]
14楼
南国羽 ：

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

2014-08-16 下午11:32 [回复]
- 超级efly ：
  
  这些封右键/开发者工具的人烦死了
  
  2014-08-19 下午10:53 [回复]
13楼
刘印：

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

2014-08-16 下午9:41 [回复]
- 超级efly ：
  
  没看到什么啊
  
  2014-08-19 下午10:52 [回复]
12楼
健康减肥博客 ：

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

2014-08-16 下午8:55 [回复]
- 超级efly ：
  
  谢谢支持～～
  
  2014-08-19 下午10:51 [回复]
11楼
杭州百乐门酒吧 ：

好像百度使用过这招吧，哈哈

2014-08-16 下午5:33 [回复]
- 超级efly ：
  
  似乎是百度招聘广告～～
  
  2014-08-19 下午10:50 [回复]
10楼
Rich ：

欢迎访问“畅想资源”！ 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

2014-08-16 下午5:11 [回复]
- 超级efly ：
  
  向本站捐款：https://www.arefly.com/donate/！
  
  2014-08-16 下午5:12 [回复]
9楼
分享好东西 ：

。。

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

2014-08-16 下午3:01 [回复]
- 超级efly ：
  
  是啊～～
  
  2014-08-16 下午3:12 [回复]
8楼
php程序员 ：

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

2014-08-16 下午2:58 [回复]
- 超级efly ：
  
  需要点击“开发人员工具”右上角的那个符号或者切换至“Console”才可以看到～～
  
  2014-08-16 下午3:12 [回复]
7楼
松果 ：

签到

2014-08-16 下午2:38 [回复]
- 超级efly ：
  
  今天签到啦！时间：下午2:51:22（使用Arefly评论框自动签到）
  
  2014-08-16 下午2:58 [回复]
  - 松果 ：
    
    自带回复？
    
    2014-08-16 下午3:00 [回复]
    - 超级efly ：
      
      对呀～今天签到啦！时间：下午3:11:11（使用Arefly评论框自动签到）
      
      2014-08-16 下午3:11 [回复]
6楼
很黑很非洲 ：

你也是用的wptouch吗？

2014-08-16 下午2:20 [回复]
- 超级efly ：
  
  是的～～
  
  2014-08-16 下午2:57 [回复]
5楼
上邪 ：

我网页的源码也有彩蛋

2014-08-16 下午2:00 [回复]
- 超级efly ：
  
  看到啦～
  
  2014-08-16 下午2:56 [回复]
4楼
惜乐博客 ：

路过支持下

2014-08-16 下午1:56 [回复]
- 超级efly ：
  
  谢谢支持～～
  
  2014-08-16 下午2:53 [回复]
地板
Junhunz ：

作死啊@@@@@

2014-08-16 下午1:51 [回复]
- 超级efly ：
  
  2014-08-16 下午2:52 [回复]
板凳
快乐家园 ：

加个图片也不错

2014-08-16 下午1:51 [回复]
- 超级efly ：
  
  是啊～
  
  2014-08-16 下午2:52 [回复]
  - 快乐家园 ：
    
    加图片我很早就玩过了
    
    2014-08-17 下午8:40 [回复]
沙发
吴尼玛 ：

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

2014-08-16 下午1:48 [回复]
- 超级efly ：
  
  什么？
  
  2014-08-16 下午2:51 [回复]