zoukankan      html  css  js  c++  java
  • 奇奇怪怪的知识之带样式的console.log()

    在这之前,经常使用的就只有info和log,并且也没有深入了解过它们之间的区别。
    偶然想起见过一些带着样式的控制台打印,在这里做个汇总。

    1.console.warn("警告信息");//打印一个警告信息
    
    2.console.error("错误信息");//打印一条错误信息
    
    3.console.table(Arr);//将数据打印成表格
    
    4.console.log('%cTEXT','color: yellow; background: black; font-size: 24px;font-size:100px');//打印个带样式的信息
    
    5.console.count();//可以用来统计函数调用次数
    
    6.console.dir({});//适合打印json 具有折叠效果
    
    7.console.time('array');
      var array= new Array(1000000);
      for (var i = array.length - 1; i >= 0; i--) {
        array[i] = new Object();
      };
      console.timeEnd('array')//统计程序执行的时间
    
    8.console.group("小学")
      // 内部嵌套
      console.group("一年级")
      console.log("语文")
      console.log("数学")
      console.groupEnd()
      //内部嵌套
      console.group("二年级")
      console.log("语文")
      console.log("数学")
      console.groupEnd()
      console.groupEnd()//分组显示控制台输出内容 默认展开  不想展开的话就使用groupCollapsed
    
    9.console.trace()//获取当前代码在堆栈中的调用路径
    
    10.console.clear()//清除控制台显示的所有内容
    
    11.console.assert(true, '判断条件不成立')//断言输出
    
    12.console.profile([profileLabel]) console.profileEnd();
    //这是个挺高大上的东西,可用于性能分析。在 JS 开发中,我们常常要评估段代码或是某个函数的性能。
    //在函数中手动打印时间固然可以,但显得不够灵活而且有误差。
    //借助控制台以及console.profile()方法我们可以很方便地监控运行性能
    

    大概就这么几种
    最花哨的来了,那就是占位符,支持的占位符有四种,分别是字符(%s)、整数(%d 或%i)、浮点数(%f)和对象(%o)。
    还有一种特殊的标示符%c,对输出的文字可以附加特殊的样式
    %c标示符可以用各种 CSS 语句来为输出添加样式,举个栗子,background属性的url()中添加图片路径就可以实现图片的输出了

    最后搞个3D文字来小刀割屁股

    console.log("%c开开眼"," text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);font-size:5em")
    

  • 相关阅读:
    小米手机做USB电脑摄像头啦,亲测可用,附有详细教程!
    【DIY文章列表标签】dt_gry_list
    Oracle 10g 设置 PL/SQL 远程
    关于硬盘“4K扇区”对齐的查看与设置方法
    oracle数据误操作恢复【flashback闪回操作】
    CENTOS下安装LNMP环境随笔
    深喉咙使用心得(陆续更新ing....)
    CENTOS6.3环境下安装VSFTPD 便于开通FTP功能随笔
    MYSQL/SQL_SERVER/ORACLE三种数据库自动备份方法
    U盘安装 ubuntu 12.04随笔
  • 原文地址:https://www.cnblogs.com/Lm-Ui-Gne/p/13724721.html
Copyright © 2011-2022 走看看