• 自定义Chrome的console(样式、打印图片、开关)


    1.常用console类型

    console.log() 常规打印 
    
    console.warn() 打印警告信息 
    
    console.error() 打印错误信息 
    
    console.time() 和 console.timeEnd() 

    注:打印两次函数的时间间隔,两者需配合使用,括号内是计时器的名字,二者需对应,此方法可用来 测试性能 等

    console.time("Array initialize");
    var array = new Array(1000000);
    for (var i = array.length - 1; i >= 0; i--) {
    array[i] = new Object();
    }
    console.timeEnd("Array initialize");

    2.自定义console样式
    格式如下:

    console.log("%c需要输出的信息", "css 代码"); 

    栗子:

    console.log("%cstyle Test","color:#0a0;font-size:5em")

    3.打印变量

    ps:此处$c后的内容必须是字符串,想打印变量可参考如下写法:

    这里写图片描述

    4.打印图片

    打印图片的原理也用到了css,在css样式中定义背景图,如:

    console.log("%c", "padding:20px 60px;background:url('https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_ca79a146.png') no-repeat;");

    5.关闭生产环境的console
    最精简的方法:在入口js处增加一行代码console.log=()=>{},其他warn,error等以此类推,开发时注释掉这行代码即可,在生产环境时再将注释取消

    6.文字渐变打印

    console.log("%c" + Mar,"background-image: -webkit-gradient(linear, left 0, right 0, from(rgb(444, 94, 170)), to(rgb(122, 152, 216)));-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-size:20px;")
  • 相关阅读:
    hbase distributed setup and configuration
    代码优化 性能调优
    正则表达
    [转载]Java&.Net虚拟机精简(GreenJVM&GreenDotNet发布)
    [JQuery]一款不错的jquery验证框架
    js特效集
    jQuery滚动插件2 jCarousel
    c3p0连接池
    php5 apache config
    jQuery滚动插件 (轮播)
  • 原文地址:https://www.cnblogs.com/hdff/p/10265424.html
Copyright © 2020-2023  润新知