5分钟教你玩转console
如何打印出带css样式的信息呢？
代码语言：javascript复制/* 基础写法，使用%c即可，可以写在任何地方，然后在后面添加我们的样式。 */
/* 所有的日志类型都可以使用 c 语言风格的 printf 消息格式，该格式定义了一个模板，其中包含一个变量被替换的 % 指示器。 */
console.log("� � �","color:red;","color:green;","color:blue;");
/* 所以在这里我们打印的内容A为红色的，B为绿色的，C为蓝色的。 */
/* 更多样式自行探索哦。 */打印图片（部分浏览器不兼容）
console.log不支持直接图片输出，但我们可以用背景图曲线救国。但你没法像平时那样输出背景图，原因呢，就是你没法直接设置 width 和 height 样式。所以我们要要输出一张 300x200 的图片的话，要用 padding 来把整个区域撑开到我们需要的大小，然后还要设置 line-height 才行。
注意：
line-height的值为图片高度。background设置图片url。padding左右两边的值是图片宽度的一半。padding上下的值，需要自己慢慢去尝试直到满足为止。
console.log("%c","line-height:200px;background:url(...);padding:150px 自定义;");博主案例
代码语言：javascript复制/* console */
console.log("%c博客名称�oubleAm", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#3fa9f5;line-height:28px;font-size:16px;");
console.log("%c网站地址%chttps://biugle.cn", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#00bc12;line-height:28px;font-size:16px;");
console.log("%c扣扣号码�005760694", "line-height:28px;padding:4px;background:#a1afc9;color:#000;font-size:16px;margin-right:15px", "color:#ff9900;line-height:28px;font-size:16px;");
console.log("%c欢迎使用doublelove！", "line-height:28px;padding:5px;color:#fff;font-weight:bolder;font-size:16px;background-color:chocolate;color:#fff;");
if (window.console && window.console.log) {
console.log(`%c页面加载消耗了 %c${(Math.round(100 * performance.now()) / 100 / 1e3).toFixed(2)}s`, "background: #fff;color: #333;text-shadow: 0 0 2px #eee, 0 0 3px #eee, 0 0 3px #eee, 0 0 2px #eee, 0 0 3px #eee;", "color:tomato;font-weight:bolder;");
localStorage.getItem("access") || localStorage.setItem("access", (new Date).getTime());
let e = new Date(parseInt(localStorage.getItem("access")));
let o = `${e.getFullYear()}年${e.getMonth() 1}月${e.getDate()}日`;
let t = 0;
localStorage.getItem("hit") ? t = parseInt(localStorage.getItem("hit")) : localStorage.setItem("hit", 0);
localStorage.setItem("hit", t);
console.log(`%c这是你自 %c${o} %c以来第 %c${t} %c次在本站打开控制台，你想知道什么秘密吗～`, "", "color:chocolate;font-weight:bolder;", "", "color:chocolate;font-weight:bolder;", "");
}其他
另外还有其他 console 方法可以自己去探索
console.time(arg1)/console.timeEnd(arg1)console.group(arg1)/console.groupCollapsed(arg1)/console.groupEnd()console.assert(a == 1, 'a != 1')console.clear()console.table(obj)console.log({arg1, arg2, arg3})
