首页 > 代码库 > js中的console很强大

js中的console很强大

 今天闲来没事,瞎逛, 发现了淘宝首页的这个:

 

 

  想起来之前在百度的 页面中也曾看到过。于是乎自己试一试。

  于是便见识到了console对象其实很强大,用好它对调试真的有很大帮助。

 代码:

 

 

 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset=utf-8> 5     <title>demo</title> 6 </head> 7 <body> 8  9  10       11   12  <script>13       /*要注意其中的%c符号,他是用来给输出添加样式的,对把它写在开头的有效*/14       /*这是百度的*/15  /*    try {16                if (window.console && window.console.log) {17                 console.log("一张网页,要经历怎样的过程,才能抵达用户面前?\n一位新人,要经历怎样的成长,才能站在技术之巅?\n探寻这里的秘密;\n体验这里的挑战;\n成为这里的主人;\n加入百度,加入网页搜索,你,可以影响世界。\n");18                 console.log("请将简历发送至 %c ps_recruiter@baidu.com( 邮件标题请以“姓名-应聘XX职位-来自console”命名)", "color:red");19                 console.log("职位介绍:http://dwz.cn/hr2013")20             }21         } catch (e) {22         }*/23         /*这是淘宝的*/24         var a = "\n\nAngular; Backbone; Console;    Dir;      Express;  Fork;   Grunt;    Haslayout;    Iconfont;\nJsonp;   Kissy;    Localstorage; Media query;  Npm;    Opacity;  Prototype;  Querystring;  Referer;\nSeajs;    Trim;   Underscore;   Vim;      Worker;   Xss;    Yslow;    Zepto;\n\n如果你对上面26个单词都能说出个所以然来,你就是我们要找的人,赶快加入我们吧!\n\n官网招聘入口:http://job.alibaba.com/zhaopin/position_detail.htm?positionId=5242\n面试官直邮:%cyuchun@taobao.com\n\n";25         try {26             window.console.log(a, "color: red")27         } catch (e) {28         }29     30  </script>   31 </body>32 </html>

 

这里是WIKI的console api:http://getfirebug.com/wiki/index.php/Console_API#console.log.28object.5B.2C_object.2C_....5D.29

 

在 这样写之前也曾尝试过如下这种写法,不过意义却都不一样了,也变相显示了 console其实很强大。

 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset=utf-8> 5     <title>demo</title> 6 </head> 7 <body> 8  9   <span id="span">Angular;  Backbone; Console;    Dir;      Express;  Fork;   Grunt;    Haslayout;    Iconfont;    Jsonp;    Kissy;    Localstorage; Media query;  Npm;    Opacity;  Prototype;  Querystring;  Referer;  Seajs;    Trim;   Underscore;   Vim;      Worker;   Xss;    Yslow;    Zepto;10   11   </span>12       13   14  <script>15     16     console.log(%o,document.getElementById(span).innerHTML);17 18 19     20  </script>   21 </body>22 </html>

 

看好api让console帮你做更多的事情吧!

js中的console很强大